【问题标题】:FlexBox (React Native) layout problem: How to vertically align items on 2 seperate linesFlexBox (React Native) 布局问题:如何在 2 条单独的行上垂直对齐项目
【发布时间】:2021-03-30 10:57:33
【问题描述】:

我正在使用 React Native 中的 FlexBox,我目前有一个包含 2 行的视图,如下所示: current layout

我想做的是将 A1 和 B1 垂直对齐如下

desired layout

我该怎么做?

【问题讨论】:

    标签: react-native flexbox


    【解决方案1】:

    您必须在两个视图上保留相同数量的 paddingLeft。但是在第二个视图中你设置了justifyContent: "space-between"

    【讨论】:

    • 是的,我已经尝试过了,但我不想要空格,因为在设备的横向模式下,布局不太漂亮。我想在第二行的两侧有空格
    • @AlixHumbert 您可以为第二个视图设置左右相同的内边距,它可以是可用宽度的百分比,所以纵向和横向看起来都很漂亮
    • 所以没有办法像 space-evenly 提供的那样具有相等的间距?
    猜你喜欢
    • 1970-01-01
    • 2018-07-06
    • 1970-01-01
    • 2018-12-29
    • 2022-01-26
    • 1970-01-01
    • 2017-09-30
    • 2018-08-19
    • 2020-12-13
    相关资源
    最近更新 更多