A Basic UI with Jetpack Compose

This is your first exercise. You will do a hands-on practice of creating and running a simple project in Android Studio using Jetpack Compose.

🟢 ANDROID WITH MACHINE LEARNING! (COURSE)

🟢 KOTLIN DEVELOPMENT! (COURSE)

Defining the title string, the contents of the strings.xml file should be:

<resources>
    <string name="app_name">Exercises</string>
    <string name="title">Little Lemon</string>
</resources>

Here’s the definition of the RestaurantName() composable:

@Composable
fun RestaurantName(name: String, size: Int) {
    Text(
        text = name,
        fontSize = size.sp
    )
}

Here’s the preview function:

@Preview(showBackground = true)
@Composable
fun RestaurantNamePreview() {
    RestaurantName(stringResource(id = R.string.title))
}

The call to RestaurantName() composable within the MainActivity should look like this:

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            LittleLemonExerciseTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    RestaurantName(
                        name = stringResource(id = R.string.title),
                        size = 32
                    )
                }
            }
        }
    }
}

This is the output on the emulator.

İbrahim Can Erdoğan

LINKEDIN

YOUTUBE

UDEMY

GITHUB