代码之家 › 专栏 › 技术社区 › raju

react原生纸中的按钮宽度

react-native-paper react-native

0

raju · 技术社区 · 4 年前

我开始学习反应原生纸,我不知道如何固定按钮宽度,目前它填满了整个父容器。

    <View>
        <Button 
        icon="camera" 
        mode="contained" 
        onPress={() => console.log('Pressed')}
        contentStyle={styles.btn}
        >
            Press me
        </Button>
    </View>



const styles = StyleSheet.create({
    btn: {
        width: 30
    }
})

这不起作用,按钮仍然是全宽的。需要帮助。

1 回复 | 直到 4 年前

1

2

Ferin Patel 4 年前

您可以更改的宽度 Button 直接使用 style 道具和添加 width 到它。

<Button 
   icon="camera" 
   mode="contained" 
   onPress={() => console.log('Pressed')}
   style={{ width: 100 }}
>
  Press me
</Button>

2

0

Haydn Oleson 3 年前

如果您的View标签是按钮的容器,则按钮需要自己的View标签,并在那里调用样式道具。

    <View>
      <View style={styles.btn}>
       <Button 
          icon="camera" 
          mode="contained" 
          onPress={() => console.log('Pressed')}
       >
        Press me
       </Button>
      </View>
    </View>



    const styles = StyleSheet.create({
      btn: {
        width: 30
      },
    });