如何将Jetpack Compose中第二个按钮下面的所有文本组件移动到一起?

huangapple go评论73阅读模式
英文:

How can i bring all the Text components below the second button in Jetpack compose?

问题

I'm sorry, but I cannot provide code translation services. If you have any other non-coding related questions or need assistance with something else, please feel free to ask, and I'd be happy to help.

英文:

I am trying to bring all the three Text below the second Button (around 10.padding) so When i try to do it , it just comes either middle or somewhere above second button. What'a wrong with the code ? i even tried Spacer but it's not working .
Below is my code.

MainActivity.kt

package com.example.basiccomposeapp

import android.graphics.Paint.Align
import android.graphics.Paint.Style
import android.graphics.fonts.FontStyle
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.example.basiccomposeapp.ui.theme.BasicComposeAppTheme
import java.time.format.TextStyle

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            BasicComposeAppTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colors.background
                ) {
                        SimpleRow()
                    RowArrangement()
                }
            }
        }
    }
}

@Composable
fun SimpleRow(){
    Column(verticalArrangement = Arrangement.spacedBy(8.dp)){
        val shape = CircleShape
        Text(
            text = "Text 1",
            style = androidx.compose.ui.text.TextStyle(
                color = Color.White,
                fontWeight = FontWeight.Bold,
                textAlign = TextAlign.Center
            ),
            modifier = Modifier
                .fillMaxWidth()
                .padding(16.dp)
                .border(2.dp, MaterialTheme.colors.secondary, shape)
                .background(MaterialTheme.colors.primary, shape)
                .padding(16.dp)
        )
        Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
            val shape1 = CircleShape
            Text(
                text ="Why",
            style = androidx.compose.ui.text.TextStyle(
                color = Color.White,
                fontWeight = FontWeight.Bold,
                textAlign = TextAlign.Center
            ),
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(16.dp)
                    .border(2.dp, MaterialTheme.colors.secondary, shape1)
                    .background(MaterialTheme.colors.primary, shape1)
                    .padding(16.dp)
            )
        }
    }
}

@Composable
fun RowArrangement(){
    Row(modifier = Modifier.fillMaxWidth().padding(16.dp),
        horizontalArrangement =Arrangement.Center,
         verticalAlignment = Alignment.CenterVertically) {
        Text(text = "text1")
        Spacer(modifier = Modifier.padding(5.dp))
        Text(text = "text2")
        Spacer(modifier = Modifier.padding(5.dp))
        Text(text = "text3")
    }
}


@Preview(showBackground = true)
@Composable
fun DefaultPreview() {
    BasicComposeAppTheme {
         SimpleRow()
        RowArrangement()
    }
}

Am i doing something wrong while giving values in the Row or Columns? i want all those texts one next to other.

答案1

得分: 1

我认为你想要将SimpleRow()RowArrangement()放在一个Column中,否则它们将重叠在一起。

Column {
     SimpleRow()
     RowArrangement()
}
英文:

I think what you want is to wrap SimpleRow() and RowArrangement() in a Column, otherwise they will be placed on top of each other.

Column {
     SimpleRow()
     RowArrangement()
}

huangapple
  • 本文由 发表于 2023年4月6日 21:38:08
  • 转载请务必保留本文链接:https://go.coder-hub.com/75950197.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定