package it372.tempconverter5 import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.material3.Text class MainActivity : ComponentActivity( ) { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { Text("Hello, friends, " + "welcome to JetPack Compose.") } } }
@Composable fun Hello(name : String) { Text("Hello, $name, welcome " + " to Jetpack Composable") }
setContent { Hello("friends") }
setContent { Hello("friends") Hello("everyone") }
setContent { Column { Hello("friends") Hello("everyone") } }
@Composable fun PreviewMainActivity( ) { Column { Hello("friends") Hello("everyone") } }
@Composable fun MainActivityContent( ) { Column { Hello("friends") Hello("everyone") } }
setContent { MainActivityContent( ) }Also change the definition of PreviewMainActivity to
@Preview(showBackground = true) @Composable fun PreviewMainActivity( ) { MainActivityContent( ) }
@Composable fun ImageHeader(image : Int, description : String) { Image( painter = painterResource(image), contentDescription = description, modifier = Modifier.height(180.dp).fillMaxWidth( ), contentScale = ContentScale.Crop ) }
@Composable fun MainActivityContent( ) { Column { ImageHeader(R.drawable.sunset, "Ocean Sunset") Hello("friends") Hello("everyone") } }
@Composable fun TempertureText(celsius : Int) { val fahrenheit = (celsius * 9 / 5) + 32 Text("$celsius Celsius = $fahrenheit Fahrenheit") }
Hello("friends") Hello("everyone")from the MainActivity function and also the Hello function because will not need these for our TemperatureConverter app.
@Composable fun MainActivityContent( ) { Column { ImageHeader(R.drawable.sunset, "Ocean Sunset") TemperatureText(0) } }
@Composable fun ConvertButton(clicked: ( ) -> Unit) { Button(onClick = clicked) { Text("Convert") } }
@Composable fun MainActivityContent( ) { Column { ImageHeader(R.drawable.sunset, "Ocean Sunset") ConvertButton { // Add event listener for button later. } TemperatureText(0) } }
@Composable fun MainActivityContent( ) { // Save Celsius value so it can be // accessed by both the convert button // and the temperature text. val celsius = remember { mutableStateOf(0) } Column { ImageHeader(R.drawable.sunset, "Ocean Sunset") ConvertButton { // Anonymous event listener // for the convert button. celsius.value = 20 } TemperatureText(celsius.value) } }
@Composable fun EnterTemperature(temperature: String, changed: (String) -> Unit) { TextField( value = temperature, label = { Text("Enter a temperature in Celsius") }, onValueChange = changed, modifier = Modifier.fillMaxWidth() ) }
@Composable fun MainActivityContent( ) { // remember means keep the mutable state // in memory so that it is available to // all layout elements in the app. val celsius = remember { mutableStateOf(0) } val newCelsius = remember { mutableStateOf("")} Column { ImageHeader(R.drawable.sunset, "Ocean Sunset") EnterTemperature(newCelsius.value) { newCelsius.value = it } ConvertButton { newCelsius.value.toIntOrNull()?.let { celsius.value = it } } TemperatureText(celsius.value) } }
@Composable fun MainActivityContent( ) { ... Column(modifier = Modifier.padding(25.dp)) { ... }
@Composable fun MainActivityContent( ) { ... Column(modifier = Modifier.padding(25.dp).fillMaxWidth( ), horizontalAlignment = Alignment.CenterHorizontally) { ... } ... }
@Composable fun MainActivityContent( ) { ... Column(modifier = Modifier.padding(25.dp).fillMaxWidth( )) { ... Row(modifier = Modifier.fillMaxWidth( ), horizontalAlignment = Alignment.CenterHorizontally) { ConvertButton { ... } } ... } ... }
// TempConverter5 Example // Source Code File: MainActivity.kt package it372.ssmith.tempconverter5 import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.activity.enableEdgeToEdge import androidx.compose.foundation.layout.Column import androidx.compose.foundation.Image import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.material3.Button import androidx.compose.material3.Text import androidx.compose.material3.TextField import androidx.compose.runtime.Composable import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.layout.ContentScale import androidx.compose.ui.res.painterResource import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp class MainActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) enableEdgeToEdge( ) setContent { MainActivityContent( ) } } @Composable fun PreviewMainActivity( ) { MainActivityContent( ) } @Preview(showBackground = true) @Composable fun MainActivityContent( ) { // Save celsius values so they can be used by the // button and the temperature text. val celsius = remember { mutableStateOf(0) } val newCelsius = remember { mutableStateOf("") } Column(modifier = Modifier.padding(25.dp).fillMaxWidth( ), horizontalAlignment = Alignment.CenterHorizontally) { ImageHeader(R.drawable.sunset, "Ocean Sunset") // Hello("friends") // Hello("everyone") EnterTemperature(newCelsius.value) { newCelsius.value = it } ConvertButton { // Anonymous event listener // for convert button // celsius.value = 20 newCelsius.value.toIntOrNull( )?.let { celsius.value = it } } TemperatureText(celsius.value) } } @Composable fun ImageHeader(image : Int, description : String) { Image( painter = painterResource(image), contentDescription = description, modifier = Modifier.height(180.dp).fillMaxWidth( ), contentScale = ContentScale.Crop ) } @Composable fun EnterTemperature(temperature: String, changed : (String) -> Unit) { TextField( value = temperature, label = { Text("Enter a temperature in Celsius") }, onValueChange = changed, modifier = Modifier.fillMaxWidth( ) ) } @Composable fun ConvertButton(clicked : ( ) -> Unit) { Button(onClick = clicked) { Text("Convert") } } @Composable fun TemperatureText(celsius : Int) { val fahrenheit = (celsius * 9) / 5 + 32 Text("$celsius Celsius = $fahrenheit Fahrenheit") } /* @Composable fun Hello(name : String) { Text("Hello, $name, " + "welcome to Jetpack Compose.") } */ }