| package com.airbnb.lottie.sample.compose |
| |
| import android.os.Bundle |
| import android.view.LayoutInflater |
| import android.view.View |
| import android.view.ViewGroup |
| import androidx.activity.ComponentActivity |
| import androidx.annotation.DrawableRes |
| import androidx.annotation.StringRes |
| import androidx.compose.foundation.Icon |
| import androidx.compose.foundation.Text |
| import androidx.compose.foundation.clickable |
| import androidx.compose.foundation.layout.* |
| import androidx.compose.material.BottomAppBar |
| import androidx.compose.material.Scaffold |
| import androidx.compose.material.ripple.RippleIndication |
| import androidx.compose.runtime.Composable |
| import androidx.compose.runtime.Providers |
| import androidx.compose.ui.Alignment |
| import androidx.compose.ui.Modifier |
| import androidx.compose.ui.graphics.Color |
| import androidx.compose.ui.platform.ComposeView |
| import androidx.compose.ui.platform.ContextAmbient |
| import androidx.compose.ui.res.stringResource |
| import androidx.compose.ui.res.vectorResource |
| import androidx.compose.ui.text.TextStyle |
| import androidx.compose.ui.unit.dp |
| import androidx.compose.ui.unit.sp |
| import androidx.fragment.app.Fragment |
| import androidx.navigation.fragment.findNavController |
| import com.airbnb.lottie.sample.compose.player.PlayerFragment |
| import com.airbnb.lottie.sample.compose.ui.LottieTheme |
| import com.airbnb.lottie.sample.compose.ui.Teal |
| import com.airbnb.lottie.sample.compose.utils.NavControllerAmbient |
| import com.airbnb.mvrx.asMavericksArgs |
| |
| abstract class ComposeFragment : Fragment() { |
| override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? { |
| return ComposeView(requireContext()).apply { |
| setContent { |
| Providers( |
| NavControllerAmbient provides findNavController(), |
| BackPressedDispatcherAmbient provides (ContextAmbient.current as ComponentActivity).onBackPressedDispatcher |
| ) { |
| LottieTheme { |
| Scaffold( |
| bottomBar = { |
| BottomAppBar( |
| backgroundColor = Color(0xFFF7F7F7), |
| elevation = 8.dp, |
| contentColor = Teal, |
| ) { |
| Row( |
| horizontalArrangement = Arrangement.SpaceAround, |
| modifier = Modifier.fillMaxWidth() |
| ) { |
| BottomBarButton(R.drawable.ic_showcase, R.string.bottom_tab_showcase) { |
| findNavController().navigate(R.id.showcase) |
| } |
| |
| BottomBarButton(R.drawable.ic_lottie_files, R.string.bottom_tab_lottie_files) { |
| findNavController().navigate(R.id.lottie_files) |
| } |
| BottomBarButton(R.drawable.ic_device, R.string.bottom_tab_preview) { |
| // DO NOT SUBMIT |
| val args = PlayerFragment.Args.Url("https://assets4.lottiefiles.com/private_files/lf30_8xbh8fop.json") |
| findNavController().navigate(R.id.player, args.asMavericksArgs()) |
| // findNavController().navigate(R.id.preview) |
| } |
| BottomBarButton(R.drawable.ic_learn, R.string.bottom_tab_learn) { |
| } |
| } |
| } |
| } |
| ) { innerPadding -> |
| Box( |
| modifier = Modifier.padding(innerPadding) |
| ) { |
| root() |
| } |
| } |
| } |
| } |
| } |
| } |
| } |
| |
| @Composable |
| abstract fun root() |
| |
| |
| @Composable |
| private fun BottomBarButton(@DrawableRes iconRes: Int, @StringRes labelRes: Int, onClick: () -> Unit) { |
| Column( |
| modifier = Modifier |
| .clickable( |
| onClick = onClick, |
| indication = RippleIndication(bounded = false) |
| ) |
| .padding(6.dp) |
| ) { |
| Icon( |
| vectorResource(iconRes), |
| modifier = Modifier |
| .align(Alignment.CenterHorizontally) |
| ) |
| Text( |
| stringResource(labelRes), |
| style = TextStyle(fontSize = 12.sp) |
| ) |
| } |
| } |
| } |