时间戳

首页 > 解决方案 > 按钮未显示在视图中

react-native - 按钮未显示在视图中

问题描述

Hw 可以将 my 对齐Button到 my 的底部RadioGroup吗？

 <View
        style={{
          height: 200,
          padding: 12
        }}
      >
        <Text style={{ fontSize: 16, color: "#fff", textAlign: "right" }}>
          {this.props.current + 1} out of 10
        </Text>
        <Text style={{ fontSize: 32, fontWeight: "bold", color: "#fff" }}>
          {this.props.question.question}
        </Text>
        <RadioGroup
          onSelect={(index, answer) => onSelect(answer)}
          selectedIndex={null}
        >
          {this.renderOptions(question)}
        </RadioGroup>
        <TouchableHighlight
          style={{
            height: 40,
            width: 160,
            borderRadius: 10,
            backgroundColor: "yellow",
            marginLeft: 50,
            marginRight: 50,
            marginTop: 20
          }}
        >
          <Button
            title="Submit Answer"
            color="#fff"
            onPress={() => {
              this.props.onSelect(this.state.answer);
            }}
          />
        </TouchableHighlight>
      </View>

标签： react-nativeflexbox

解决方案

尝试<View style={{flexDireaction: "row"}}><View>content radio group</View><View>content button</View> </View>将其包装在视图中并添加样式： position: 'absolute', right: 0, bottom: 0或 flex: 1, flexDirection: 'column-reverse'

推荐阅读