blocks|key|431342|text|您可以创建一个Box来填充行的其余部分，并将Button放入其中。然后，可以将Button对齐到右边。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|431343|Box(modifier+=+Modifier.fillMaxWidth())+{
++++RadioButton(modifier+=+Modifier.align(Alignment.End)){}
}|code-block|syntax|javascript|431344|对于列(而不是Box+)，也可以实现同样的目的，但是行中的每个单独的元素都应该有一个列来包装它。|431345|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

You could create a Box that fills the rest of the Row and put the Button inside it. You can then align the Button to the right.
<pre><code>Box(modifier = Modifier.fillMaxWidth()) {
 RadioButton(modifier = Modifier.align(Alignment.End)){}
}
</code></pre>
The same can be achieved with columns instead of the Box, but then every separate element inside the row should have a column wrapping it.

blocks|key|332723|text|最简单的解决方案是在文本和单选按钮之间添加一个带有Spacer的Modifier.weight(1f)。Row和Column根据组件的权重在具有weight修饰符的组件之间分配剩余可用空间。由于只有一个，它将接收所有剩余的空间，按单选按钮到极右。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|332724|例如，下面的代码将产生您想要的行为：|332725|Row(modifier+=+Modifier.height(56.dp).fillMaxWidth(),+verticalAlignment+=+Alignment.CenterVertically){
++++Icon(Icons.Default.Add,null)
++++Text("Some+text+here")
++++Spacer(Modifier.weight(1f).fillMaxHeight().background(Color.Green))+//+height+and+background+only+for+demonstration
++++RadioButton(selected+=+false,+onClick+=+{+/*TODO*/+})
}|code-block|syntax|javascript|332726|​|332727|📷|atomic|332728|332729|正如我所说的，剩余的空间是根据每个元素的权重分布的，所以尽管这不是您想要实现的，但是这个例子可能是这样的。|332730|Row(modifier+=+Modifier.height(56.dp).fillMaxWidth(),+verticalAlignment+=+Alignment.CenterVertically)+{
++++Icon(Icons.Default.Add,+null)
++++Spacer(Modifier.weight(1f).fillMaxHeight().background(Color.Red))+//+height+and+background+only+for+demonstration
++++Text("Some+text+here")
++++Spacer(Modifier.weight(4f).fillMaxHeight().background(Color.Green))+//+height+and+background+only+for+demonstration
++++RadioButton(selected+=+false,+onClick+=+{+/*TODO*/+})
}|332731|会让你|332732|332733|332734|332735|测量图标、文本和单选按钮后的剩余空间分配为红色空格20%25，绿色空间80%25，因为这是它们在总重量中所占的份额(1/5和4/5)。|332736|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://developer.qcloudimg.com/http-save/yehe-900000/c1d509fdf64cb4505bf3e0d0fe107236.png|imageAlt|1|https://developer.qcloudimg.com/http-save/yehe-900000/531cdf6f2ac30c4a63c82aa5e26dc893.png^0|P|6|W|J|1G|3|1K|6|20|6|0|0|0|0|0|1|0|0|0|0|0|0|0|0|1|1|0|0|0^^$0|@$1|2|3|4|5|6|7|1E|8|@$9|1F|A|1G|B|C]|$9|1H|A|1I|B|C]|$9|1J|A|1K|B|C]|$9|1L|A|1M|B|C]|$9|1N|A|1O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1P|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|1Q|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|1R|8|@]|D|@]|E|$]]|$1|O|3|P|5|Q|7|1S|8|@]|D|@$9|1T|A|1U|1|1V]]|E|$]]|$1|R|3|N|5|6|7|1W|8|@]|D|@]|E|$]]|$1|S|3|T|5|6|7|1X|8|@]|D|@]|E|$]]|$1|U|3|V|5|J|7|1Y|8|@]|D|@]|E|$K|L]]|$1|W|3|X|5|6|7|1Z|8|@]|D|@]|E|$]]|$1|Y|3|N|5|6|7|20|8|@]|D|@]|E|$]]|$1|Z|3|P|5|Q|7|21|8|@]|D|@$9|22|A|23|1|24]]|E|$]]|$1|10|3|N|5|6|7|25|8|@]|D|@]|E|$]]|$1|11|3|12|5|6|7|26|8|@]|D|@]|E|$]]|$1|13|3|-4|5|6|7|27|8|@]|D|@]|E|$]]]|14|$15|$5|16|17|18|E|$19|1A|1B|-4]]|1C|$5|16|17|18|E|$19|1D|1B|-4]]]]

The simplest solution would be to add a <code>Spacer</code> with <code>Modifier.weight(1f)</code> between your text and the radio button. <code>Row</code> and <code>Column</code> distribute remaining available space between components with a <code>weight</code> Modifier according to their weight. Since there is only one, it will receive all of the remaining space, pushing the radio button to the far right.
For example following code would produce your desired behavior:
<pre class="lang-kotlin prettyprint-override"><code>
Row(modifier = Modifier.height(56.dp).fillMaxWidth(), verticalAlignment = Alignment.CenterVertically){
 Icon(Icons.Default.Add,null)
 Text(&quot;Some text here&quot;)
 Spacer(Modifier.weight(1f).fillMaxHeight().background(Color.Green)) // height and background only for demonstration
 RadioButton(selected = false, onClick = { /*TODO*/ })
}
</code></pre>
<a href="https://i.stack.imgur.com/oUG2t.png" rel="noreferrer"><img src="https://i.stack.imgur.com/oUG2t.png" alt="enter image description here" /></a>
As I said remaining space is distributed according to the weight of each element, so although this is not what you want to achieve, an example how this might look like
<pre class="lang-kotlin prettyprint-override"><code>Row(modifier = Modifier.height(56.dp).fillMaxWidth(), verticalAlignment = Alignment.CenterVertically) {
 Icon(Icons.Default.Add, null)
 Spacer(Modifier.weight(1f).fillMaxHeight().background(Color.Red)) // height and background only for demonstration
 Text(&quot;Some text here&quot;)
 Spacer(Modifier.weight(4f).fillMaxHeight().background(Color.Green)) // height and background only for demonstration
 RadioButton(selected = false, onClick = { /*TODO*/ })
}
</code></pre>
will get you
<a href="https://i.stack.imgur.com/0bKAv.png" rel="noreferrer"><img src="https://i.stack.imgur.com/0bKAv.png" alt="enter image description here" /></a>
The remaining space after measuring the icon, text and radio button are distributed as 20% to the red Spacer and 80% to the green one, since that is their share of the total weight (1/5 and 4/5)

I want to set RadioButton component at the end of Row in Jetpack Compose. Tried to using Constraint Layout and moved RadioButton outside the Row but then the RadioButton wasn't centered with other components in Row. What should I do?
<a href="https://i.stack.imgur.com/w6dFO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/w6dFO.png" alt="enter image description here" /></a>
Here is my code:
<pre><code> ConstraintLayout {
 val (row, button) = createRefs()
 Row(
 modifier = Modifier
 .height(56.dp)
 .fillMaxWidth()
 .constrainAs(row){
 start.linkTo(parent.start)
 end.linkTo(parent.end)
 },
 verticalAlignment = Alignment.CenterVertically
 ) {
 Icon(
 /* *** */
 )
 Text(
 text = &quot;mail@gmail.com&quot;,
 modifier = Modifier.padding(start = 16.dp, end = 16.dp),
 )
 RadioButton(
 /* *** */
 )
 }

 }
</code></pre>
What is more i want to cut the Text component if the text is too long (not overlay or underlay the Radio Button)

How to set component at end of Row in Jetpack Compose?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我想在Jetpack中行的末尾设置RadioButton组件。尝试使用约束布局并将RadioButton移出行之外，但是RadioButton没有与行中的其他组件集中。我该怎么办？​这是我的代码：    ConstraintLayout {        val (row, button) = createRefs()...

问如何在Jetpack组合的行尾设置组件？
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在Jetpack组合的行尾设置组件？EN