如何在React Native(Android)中居中Facebook登录按钮的文本?

6

我在我的React-Native应用中使用Facebook SDK(通过react-native-fbsdk)的登录按钮。

在iOS中,按钮文本Continue with Facebook垂直居中显示,但在Android 7.0中偏离中心。

我唯一的选择是制作自己的自定义按钮,手动调用LoginManager,还是有一种方法可以使用样式对齐文本(我尝试过alignItems和justifyContent)?根据这个SO问题,似乎我必须做前者。

这是我现在的代码:

<LoginButton
   scope={'public_profile email'}
   style={{
       width: 220,
       height: 40
   }}
   onLoginFinished={this._facebookLogin}
   onLogoutFinished={() => console.log('logout.')}
/>

Photo of misaligned text


你找到解决方案了吗? - Ahmed Kamal
放弃了 :/ - Abundance
好的,我会发布我的答案。 - Ahmed Kamal
1个回答

4
您可以将按钮放入容器中。
<View style={{
  width: 220, // whatever you want
  height: 50, // whatever you want
  justifyContent: 'center', // center the button
  backgroundColor: '#4267B2', // the same as the actual button
  paddingHorizontal: 10 // optionally add some horizontal padding for better looking
}}>
  <LoginButton
    scope={'public_profile email'}
    style={{
       flex: 1, // fill the container
       maxHeight: 30 // the default height
   }}
   onLoginFinished={this._facebookLogin}
   onLogoutFinished={() => console.log('logout.')}
  />
</View>

结果

enter image description here


1
我正在经历这个噩梦。谢谢这个。 - KeshavDulal

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接