Coding Bihar

Jetpack Compose Unit converter

Jetpack Compose Unit converter  - Coding Bihar
Jetpack Compose Unit converter

Jetpack Compose Unit converter 

Unit Converter is a tool that converts one unit to different unit. In this tutorial we will learn to build an Android App which converts temperature unit Celsius and Fahrenheit.

There are two parts of programming this app in one part we design the UI of our app. In the UI we need a text field where user can input the value, buttons with text to perform actions.

This is the small project We are going to learn but it is informative for the beginners. I hope you will enjoy and learn the basic of Jetpack Compose through building this app.

 The Android Studio latest version Koala 🐨 is being used for this tutorial.

Android Studio latest version Koala

Steps:

  1. Create a New Project in Android Studio
  2. Create a New File named UnitConverter for UI 
  3. Create an Enum class to define different conversion types
  4. Add a real device and Run the App

MainActivity

Copy this code →

package com.codingbihar.composeapp

import ...
          
class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContent {
            ComposeAppTheme {
                //Scaffold(modifier = Modifier.fillMaxSize()) { innerPadding ->
             
                UnitConverter()
                
            }
        }
    }
}

UnitConverter

Copy this code →

package com.codingbihar.composeapp

import ...
          
@Composable
fun UnitConverter() {
    var input by remember { mutableStateOf("") }
    var output by remember { mutableStateOf("") }
    var conversionLabel by remember { mutableStateOf("Conversion Output") }
 
    Column(
        modifier = Modifier
            .padding(16.dp)
            .fillMaxWidth(),
        verticalArrangement = Arrangement.spacedBy(16.dp)
    ) {
        Row (Modifier.padding(16.dp)){
    
            TextField(
                value = input,
                onValueChange = { input = it },
                label = { Text("Input") },
                keyboardOptions = KeyboardOptions.Default.copy(keyboardType = KeyboardType.Number)
            )
       
            TextField(
                value = output,
                onValueChange = {},
                label = { Text("Output ($conversionLabel)") },
                readOnly = true,          
            )
        }
     
        ConversionButton(
            label = "Meters to Centimeters",
            onClick = {
                output = convertUnits(input, ConversionType.MetersToCentimeters)
                conversionLabel = "Centimeter"
            }
        )
        ConversionButton(
            label = "Centimeters to Meters",
            onClick = {
                output = convertUnits(input, ConversionType.CentimetersToMeters)
                conversionLabel = "Centimeter"
            }
        )

        ConversionButton(
            label = "Meters to Feet",
            onClick = {
                output = convertUnits(input, ConversionType.MetersToFeet)
                conversionLabel = "Feet"
            }
        )
        ConversionButton(
            label = "Feet to Meters",
            onClick = {
                output = convertUnits(input, ConversionType.FeetToMeters)
                conversionLabel = "Meters"
            }
        )
        ConversionButton(
            label = "Kilograms to Pounds",
            onClick = {
                output = convertUnits(input, ConversionType.KilogramsToPounds)
                conversionLabel = "Pounds"
            }
        )
        ConversionButton(
            label = "Pounds to Kilograms",
            onClick = {
                output = convertUnits(input, ConversionType.PoundsToKilograms)
                conversionLabel = "Kilograms"
            }
        )
        ConversionButton(
            label = "Celsius to Fahrenheit",
            onClick = {
                output = convertUnits(input, ConversionType.CelsiusToFahrenheit)
                conversionLabel = "Fahrenheit"
            }
        )
        ConversionButton(
            label = "Fahrenheit to Celsius",
            onClick = {
                output = convertUnits(input, ConversionType.FahrenheitToCelsius)
                conversionLabel = "Celsius"
            }
        )
        ConversionButton(
            label = "Celsius to Kelvin",
            onClick = {
                output = convertUnits(input, ConversionType.CelsiusToKelvin)
                conversionLabel = "Kelvin"
            }
        )
        ConversionButton(
            label = "Kelvin to Celsius",
            onClick = {
                output = convertUnits(input, ConversionType.KelvinToCelsius)
                conversionLabel = "Celsius"
            }
        )
        ConversionButton(
            label = "Kelvin to Fahrenheit",
            onClick = {
                output = convertUnits(input, ConversionType.KelvinToFahrenheit)
                conversionLabel = "Fahrenheit"
            }
        )
        ConversionButton(
            label = "Fahrenheit to Kelvin",
            onClick = {
                output = convertUnits(input, ConversionType.FahrenheitToKelvin)
                conversionLabel = "Kelvin"
            }
        )


    }
}

@Composable
fun ConversionButton(
    label: String,
    onClick: () -> Unit
) {
    Button(
        onClick = onClick,
        modifier = Modifier.fillMaxWidth()
    ) {
        Text(label)
    }
}
// Conversion Logic
fun convertUnits(value: String, conversionType: ConversionType): String {
    return try {
        val input = value.toDouble()
        val result = when (conversionType) {
            ConversionType.MetersToCentimeters -> input * 100
            ConversionType.CentimetersToMeters -> input /100
            ConversionType.MetersToFeet -> input * 3.28084
            ConversionType.FeetToMeters -> input / 3.28084
            ConversionType.KilogramsToPounds -> input * 2.20462
            ConversionType.PoundsToKilograms -> input / 2.20462
            ConversionType.CelsiusToFahrenheit -> input * 9 / 5 + 32
            ConversionType.FahrenheitToCelsius -> (input - 32) * 5 / 9
            ConversionType.CelsiusToKelvin -> (input + 273.15)
            ConversionType.KelvinToCelsius -> (input - 273.15)
            ConversionType.KelvinToFahrenheit -> (input - 273.15) * 1.8 + 32
            ConversionType.FahrenheitToKelvin -> (input - 32.0) * (5.0 / 9.0)
        }
        DecimalFormat("#.##").format(result) // Round to nearest integer and convert to string
    } catch (e: NumberFormatException) {
        "Invalid input"
    }
}

enum class

enum class ConversionType {
    MetersToCentimeters,
    CentimetersToMeters,
    MetersToFeet,
    FeetToMeters,
    KilogramsToPounds,
    PoundsToKilograms,
    CelsiusToFahrenheit,
    FahrenheitToCelsius,
    KelvinToCelsius,
    CelsiusToKelvin,
    KelvinToFahrenheit,
    FahrenheitToKelvin
}

OUTPUT:

Jetpack Compose Unit converter Output

Also Read

 Sandeep Gupta

Posted by Sandeep Gupta

Please share your feedback us at:sandeep@codingbihar.com. Thank you for being a part of our community!

Special Message

Welcome to coding bihar!