Friday, March 5, 2021

jetpack compose - How to use Floating Action Button

MainActivity.kt

package com.cfsuman.jetpackcompose

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Toast
import androidx.activity.compose.setContent
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Upload
import androidx.compose.runtime.Composable
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            MainContent()
        }
    }


    @Composable
    fun MainContent(){
        Scaffold(
            backgroundColor = Color(0xFFFEFEFA),
            floatingActionButtonPosition = FabPosition.End,
            floatingActionButton = {
                FloatingActionButton(
                    onClick = {
                        Toast.makeText(
                            this,
                            "Clicked",
                            Toast.LENGTH_SHORT
                        ).show()
                    },
                    backgroundColor = Color(0xFF88540B),
                    contentColor = Color.White,
                    elevation = FloatingActionButtonDefaults.elevation(6.dp)
                ) {
                    Icon(
                        Icons.Filled.Upload,
                        contentDescription = "Localized description"
                    )
                }
            }
        ){}
    }


    @Preview
    @Composable
    fun ComposablePreview(){
        //MainContent()
    }
}