更改 Flex Grid 中的列宽

发布于 2024-07-25 02:25:55 字数 1273 浏览 13 评论 0原文

我使用 mx.containers.Grid 来布局一些数据,最后一列是一组复选框。 MXML 代码片段:

<mx:Grid width="95%" height="50%">
  <mx:GridRow id="row1">
    <mx:GridItem>
      <mx:Label id="label1" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue1" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox1" />
    </mx:GridItem>
  </mx:GridRow>
  <mx:GridRow id="row2">
    <mx:GridItem>
      <mx:Label id="label2" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue2" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox2" />
    </mx:GridItem>
  </mx:GridRow>
  <mx:GridRow id="row3">
    <mx:GridItem>
      <mx:Label id="label3" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue3" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox3" />
    </mx:GridItem>
  </mx:GridRow>
</mx:Grid>

基本上,我想要标签 & 文本值以网格组件认为合适的方式对齐。 但是,我希望复选框右对齐。 我尝试将 textValues 的宽度设置为 100%,但它没有任何作用。 我不想使用硬编码的像素值/画布等,因为这很容易更改/更新,这一点很重要。

I'm using a mx.containers.Grid to layout some data, and the last column is a set of checkboxes. MXML Code snippet:

<mx:Grid width="95%" height="50%">
  <mx:GridRow id="row1">
    <mx:GridItem>
      <mx:Label id="label1" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue1" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox1" />
    </mx:GridItem>
  </mx:GridRow>
  <mx:GridRow id="row2">
    <mx:GridItem>
      <mx:Label id="label2" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue2" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox2" />
    </mx:GridItem>
  </mx:GridRow>
  <mx:GridRow id="row3">
    <mx:GridItem>
      <mx:Label id="label3" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue3" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox3" />
    </mx:GridItem>
  </mx:GridRow>
</mx:Grid>

Basically, I want the labels & text values to align however the Grid component sees fit. However, I'd like the checkboxes to be right-aligned. I've tried setting the width of the textValues to 100% and it does nothing. I don't want to use hard-coded pixel values/canvases/etc because it is important that this is easy to change/update.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

ぃ双果 2024-08-01 02:25:55

我找到了一个解决方案,但它有点像黑客。 但我会把它发布给那些和我有同样问题的人:

<mx:Grid width="95%" height="50%">
  <mx:GridRow id="row1" width="100%">
    <mx:GridItem>
      <mx:Label id="label1" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue1" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox1" width="100%" horizontalAlign="right" />
    </mx:GridItem>
  </mx:GridRow>
  <mx:GridRow id="row2" width="100%">
    <mx:GridItem>
      <mx:Label id="label2" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue2" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox2" width="100%" horizontalAlign="right"/>
    </mx:GridItem>
  </mx:GridRow>
  <mx:GridRow id="row3" width="100%">
    <mx:GridItem>
      <mx:Label id="label3" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue3" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox3" width="100%" horizontalAlign="right"/>
    </mx:GridItem>
  </mx:GridRow>
</mx:Grid>

基本上,将'width =“100%”'添加到每个GridRow,然后添加'width =“100%”horizo​​ntalAlign =“right”'每个您想要右对齐的 GridItem。

I found a solution, but it is kind-of a hack. But I'll post it for people who are having the same problem as I was:

<mx:Grid width="95%" height="50%">
  <mx:GridRow id="row1" width="100%">
    <mx:GridItem>
      <mx:Label id="label1" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue1" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox1" width="100%" horizontalAlign="right" />
    </mx:GridItem>
  </mx:GridRow>
  <mx:GridRow id="row2" width="100%">
    <mx:GridItem>
      <mx:Label id="label2" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue2" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox2" width="100%" horizontalAlign="right"/>
    </mx:GridItem>
  </mx:GridRow>
  <mx:GridRow id="row3" width="100%">
    <mx:GridItem>
      <mx:Label id="label3" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:Label id="textValue3" ... />
    </mx:GridItem>
    <mx:GridItem>
      <mx:CheckBox id="checkBox3" width="100%" horizontalAlign="right"/>
    </mx:GridItem>
  </mx:GridRow>
</mx:Grid>

Basically, add 'width="100%"' to every GridRow, and then add 'width="100%" horizontalAlign="right"' to every GridItem you want to be right-aligned.

方觉久 2024-08-01 02:25:55

尝试将 GridRow / GridItem 的宽度也设置为 100%。

Try setting the width of the GridRow / GridItem to 100% as well.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文