Android jetpack 撰写没有 xml 的片段

时间:2021-04-17 01:06:31

标签: android android-jetpack-compose

晚安!我正在使用 drawerContent 和 navigationIcon 创建菜单,但是我可以创建一个没有 xml 的 Fragment() 吗?在撰写喷气背包。如果有人有任何参考资料,我将不胜感激...

2 个答案:

答案 0 :(得分:1)

使用 Compose,您可以尝试不同的东西。
您可以使用 Navigation component(当前位于 1.0.0-alpha10

在组合项之间导航

创建一个 NavController

val navController = rememberNavController()

并用目的地定义一个 NavHost

NavHost(
    navController,
    startDestination = "entry1"
) {
    composable("entry1") { Entry1(..) }
    composable("entry2") { Entry2(..) }
    composable("entry3") { Entry3(..) }
}

为了简化导航,只需创建一个密封类(这不是强制性的)。

sealed class Screen(val route: String, @StringRes val resourceId: Int) {
    object Entry1 : Screen("entry1", R.string.entry1)
    object Entry2 : Screen("entry2", R.string.entry2)
    object Entry3 : Screen("entry3", R.string.entry3)
}

并将 NavHost 更改为:

NavHost(
    navController,
    startDestination = Screen.Entry1.route
) {
    composable(Screen.Entry1.route) { Entry1(/*..*/) }
    composable(Screen.Entry2.route) { Entry2(/*..*/) }
    composable(Screen.Entry3.route) { Entry3(/*..*/) }
}

现在只需使用 Scaffold 创建一个 drawerContent 和 navigationIcon 来打开菜单并导航到目的地:

val navController = rememberNavController()
val current by navController.currentBackStackEntryAsState()
val scaffoldState = rememberScaffoldState()
val scope = rememberCoroutineScope()

val items = listOf(
    Screen.Entry1,
    Screen.Entry2,
    Screen.Entry3
)

Scaffold(
    scaffoldState = scaffoldState,
    drawerContent = {
        //val currentRoute = current?.arguments?.getString(KEY_ROUTE)
        val currentRoute = current?.destination?.route

        items.forEach { screen ->
            val selected = currentRoute == screen.route
            val selectedColor = if (selected) Color.Yellow else Color.Transparent
            Row(modifier = Modifier
                .fillMaxWidth()
                .height(32.dp)
                .background(selectedColor)
                .clickable {
                    scope.launch { scaffoldState.drawerState.close()}
                    navController.navigate(screen.route) {
                        popUpTo = navController.graph.startDestination
                        launchSingleTop = true
                    }
                }) {
                   Text(stringResource(screen.resourceId))
            }
        }
    },
    topBar = {
        TopAppBar(){
            IconButton(
                onClick = {
                    scope.launch { scaffoldState.drawerState.open() }
                }
            ) {
                Icon(Icons.Filled.Menu,"")
            }
        }
    },
    content = {
        NavHost(
            navController,
            startDestination = Screen.Entry1.route
        ) {
          composable(Screen.Entry1.route) { Entry1(/*..*/) }
          composable(Screen.Entry2.route) { Entry2(/*..*/) }
          composable(Screen.Entry3.route) { Entry3(/*..*/) }
        }
    }
)

哪里:

@Composable
fun Entry1(navigateTo: () -> Unit) {

    Column(){
         /*.....*/
    }
}

enter image description here

答案 1 :(得分:0)

我的课看起来像这样:

package com.example.quitanda

import android.app.Activity
import android.content.Intent
import android.os.Bundle
import android.widget.Toast
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.result.contract.ActivityResultContracts
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material.icons.filled.Menu
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.testTag
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.navigation.NavController
import androidx.navigation.compose.*
import com.google.accompanist.coil.CoilImage
import kotlinx.coroutines.CoroutineScope
import kotlinx.coroutines.launch


class MainActivity : ComponentActivity() {
    private val responseState = mutableStateOf("")

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent{
            MainContent()
        }
    }


    @Composable
    private fun RecyclerView(){
        Text(text = responseState.value)

        LazyColumn(/*contentPadding = PaddingValues(horizontal = 16.dp, vertical = 8.dp),*/
                modifier = Modifier.fillMaxSize()){
            for(i in 0..50){
                item {
                    Text(text = "Categoria 2, categoria 1",fontSize = 15.sp,
                            color=Color.White,modifier= Modifier
                        .background(
                                colorResource(id = R.color.red)
                        )
                        .fillMaxWidth(100f))
                    Row(verticalAlignment = Alignment.CenterVertically,
                            modifier= Modifier
                                .padding(bottom = 8.dp)
                                .fillMaxWidth(100f)
                        ) {

                        Images("https://quitandadivino.com.br/_next/image?url=https%3A%2F%2Fapi.quitandadivino.com.br%2Fuploads%2Fabacaxi_perola_20afb6c700.jpg&w=300&q=75")

                        Column {
                            Text("Abacaxi",fontSize = 20.sp)
                            Text("Aprox. 0,185g/un",fontSize = 15.sp,color=Color.LightGray)
                            Text("R$ 120,00/UN",fontSize = 15.sp,color=Color.Red)
                            Text("R$ 120,00/KG",fontSize = 15.sp,color=Color.Red)
                        }

                        Column(modifier= Modifier
                            .fillMaxWidth(100f)
                            .padding(5.dp)
                           ,horizontalAlignment = Alignment.End) {
                            Button(
                                    onClick = {},
                                    colors = ButtonDefaults.buttonColors(
                                            backgroundColor = Color.Red,
                                            contentColor = Color.White)
                            ) {
                                Text(text = stringResource(id = R.string.comprar))
                            }
                        }
                    }

                    Text(text = " ",fontSize = 15.sp,
                            modifier = Modifier
                                .padding(bottom = 2.dp) // margin
                                .fillMaxWidth(100f)
                                .background(colorResource(id = R.color.red))
                        )

                }
            }
        }

    }

    private fun onPressView(){
        Toast.makeText(this,"Testar",Toast.LENGTH_LONG).show();
    }

    @Composable
    private fun Images(url:String){
        Card(
                modifier = Modifier
                    .size(110.dp)
                    .testTag("circle")
                    .fillMaxSize()
                    .clickable(onClick = { onPressView() })
                    .padding(10.dp),
                shape = CircleShape,
                elevation = 2.dp,
        ) {

            CoilImage(
                    data = url,
                    contentDescription = "Abacaxi",
                    fadeIn = true
            )
        }
    }

    @Composable
    private fun MainContent(){
        val scaffoldState = rememberScaffoldState()
        val scope = rememberCoroutineScope()
        val navController = rememberNavController()

         Scaffold(
                topBar = {
                    TopBar(scope,scaffoldState)
                         },
                content={

                    NavHost(
                            navController,
                            startDestination = Screen.Entry1.route
                    ) {
                        composable(Screen.Entry1.route) { Entry1() }
                        composable(Screen.Entry2.route) { Entry2() }
                        composable(Screen.Entry3.route) { Entry3() }
                    }
                },
                floatingActionButton = { MainFab() },
                drawerContent = {
                    DrawerContent(scope,scaffoldState,navController)
                },
                scaffoldState = scaffoldState
        )
    }


    @Composable
    private fun DrawerContent(scope: CoroutineScope,scaffoldState:ScaffoldState
    ,navController: NavController
    ){

        val items = listOf(
                Screen.Entry1,
                Screen.Entry2,
                Screen.Entry3
        )

        Text("Drawer content", style = MaterialTheme.typography.h5)

        items.forEach { screen ->
            Row(modifier = Modifier
                .fillMaxWidth()
                .height(32.dp)
                .clickable {
                    scope.launch { scaffoldState.drawerState.close() }
                    navController.navigate(screen.route) {
                        popUpTo = navController.graph.startDestination
                        launchSingleTop = true
                    }
                }) {
                Text(stringResource(screen.resourceId))
            }
        }
    }

    @Composable
    private fun TopBar(scope: CoroutineScope,scaffoldState:ScaffoldState){
        TopAppBar(title={
            Text(text = stringResource(id = R.string.app_name))
        },
                backgroundColor = colorResource(id = R.color.green),
                contentColor = Color.White,
                navigationIcon ={
                    IconButton(
                            onClick = {scope.launch { scaffoldState.drawerState.open() } }
                    ) {
                        Icon(imageVector = Icons.Default.Menu, contentDescription ="Menu" )
                    }
                }
        )
    }

    @Composable
    private fun MainFab () {
        FloatingActionButton(onClick = {showAddForm()}) {
            Icon(imageVector = Icons.Filled.Add, contentDescription = "Adicionar")
        }
    }

   private var resultLauncher = registerForActivityResult(ActivityResultContracts.StartActivityForResult()) { result ->
        if (result.resultCode == Activity.RESULT_OK) {
            // There are no request codes
            val response = result.data?.getParcelableExtra<AddUserState>("user_state")
            responseState.value = response.toString()
        }
    }

    private fun showAddForm() {
        val intent = Intent(this, FormActivity::class.java)
        resultLauncher.launch(intent)
    }

    @Composable
    private fun Entry1(){
        Text(text = stringResource(id = R.string.entry1))
        RecyclerView()
    }

    @Composable
    private fun Entry2(){
        Text(text = stringResource(id = R.string.entry2))
    }

    @Composable
    private fun Entry3(){
        Text(text = stringResource(id = R.string.entry3))
    }
}

@Gabriele Mariotti 非常感谢您