[英]Android jetpack compose fragment without xml
Goodnight, I'm using drawerContent and navigationIcon to create the menu?晚安,我正在使用drawerContent 和navigationIcon 创建菜单? but can I create a Fragment () without xml.
但是我可以创建一个没有 xml 的片段()吗? in compose jetpack.
在组成喷气背包。 If anyone has any references I would be grateful...
如果有人有任何参考,我将不胜感激......
With Compose you can try something different.使用 Compose,您可以尝试不同的东西。
You can navigate between composables using the Navigation component (currently in 1.0.0-alpha10
)您可以使用Navigation 组件(目前在
1.0.0-alpha10
中)在可组合项之间导航
Create a NavController
with:使用以下命令创建一个
NavController
:
val navController = rememberNavController()
and define a NavHost
with the destinations:并定义一个带有目的地的
NavHost
:
NavHost(
navController,
startDestination = "entry1"
) {
composable("entry1") { Entry1(..) }
composable("entry2") { Entry2(..) }
composable("entry3") { Entry3(..) }
}
To simplify the navigation just create a sealed class (it is not mandatory).为了简化导航,只需创建一个密封的 class(这不是强制性的)。
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)
}
and change the NavHost
to:并将
NavHost
更改为:
NavHost(
navController,
startDestination = Screen.Entry1.route
) {
composable(Screen.Entry1.route) { Entry1(/*..*/) }
composable(Screen.Entry2.route) { Entry2(/*..*/) }
composable(Screen.Entry3.route) { Entry3(/*..*/) }
}
Now just use a Scaffold
to create a drawerContent and navigationIcon to open the menu and navigate to the destination:现在只需使用
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(/*..*/) }
}
}
)
where:在哪里:
@Composable
fun Entry1(navigateTo: () -> Unit) {
Column(){
/*.....*/
}
}
It worked my class looked like this:它工作我的 class 看起来像这样:
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 Thank you very much @Gabriele Mariotti 非常感谢
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.