android - 如何在 React Native (Android) 的 Facebook 登录按钮中居中放置文本？

Question

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

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

我唯一的选择是制作我自己的手动调用 LoginManager 的自定义按钮，还是有办法使用样式对齐文本(我尝试了 alignItems 和 justifyContent)？看来我必须根据 this SO question 做前者.

这是我目前的代码:

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

Answer 1

你可以把按钮包装到一个容器里

<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>

结果