react native ios平臺上textAlignVertical屬性不起作用
為了實現text文字居中,原本在android 上開發以下的css樣式是ok的
PaymentTimeStyle:{
height:36,
width:100,
fontSize:14,
textAlign:'center',
alignItems:'center',
justifyContent:'center',
textAlignVertical:'center',
}
但在ios上只有水平居中,沒有垂直居中,上網查了一下,很多人是通過view巢狀text,但覺得這樣麻煩,而且當View的層級越深渲染的速度也會越慢。所以建議還是用以下css屬性
lineHeight:36
但是測試時加上了在android上又顯示不正常,無奈下為了不影響android,做了調整,最後的樣式程式碼如下:
import {StyleSheet,Platform} from 'react-native';
PaymentTimeStyle:{
height:36,
width:100,
textAlign:'center',
alignItems:'center',
justifyContent:'center',
textAlignVertical:'center',
...Platform.select({
ios:{
lineHeight:36,
},
android:{
}
}),
}
相關文章
- React Native區分安卓/iOS平臺React Native安卓iOS
- React Native 自定義元件及屬性React Native元件
- iOS React Native 混合開發整合React NativeiOSReact Native
- React-Native修改安卓平臺的包名React安卓
- React Native commond+r 不起作用 無響應React Native
- 在 Windows 上搭建 React Native IOS 開發環境WindowsReact NativeiOS開發環境
- React Native填坑之旅--多平臺支援之WebReact NativeWeb
- 跨平臺開發之React Native初體驗React Native
- React 元件屬性React元件
- iOS動畫 屬性屬性解析iOS動畫
- iOS平臺上的中文排序iOS排序
- Mac上配置React NativeMacReact Native
- React Native 探索(三)元件的 Props (屬性) 和 State (狀態)React Native元件
- react-native呼叫ios native方法-回撥ReactiOS
- react 元件的屬性React元件
- 從 React Native 到 Flutter,移動跨平臺方案的真相React NativeFlutter
- React-Native iOS Module開發ReactiOS
- React Native——flex(彈性佈局)React NativeFlex
- 移動跨平臺方案對比:WEEX、React Native、Flutter和PWAReact NativeFlutter
- 《React Native跨平臺移動應用開發》讀後鬼扯React Native
- React屬性用法總結React
- React之props屬性React
- [React]屬性和狀態React
- OpenHarmony相容性平臺更新上線
- iOS UITableView 修改屬性iOSUIView
- iOS 富文字屬性iOS
- Facebook 是如何構建第一個跨平臺的 React Native APPReact NativeAPP
- Facebook 是如何做第一個跨平臺的 React Native APPReact NativeAPP
- React專題:不可變屬性React
- React Native入門-實戰解析(上)React Native
- 探索 react-native run-ios(android)ReactiOSAndroid
- ? React-Native 官方示例演示 ( ios & android)ReactiOSAndroid
- React Native iOS混合開發實戰教程React NativeiOS
- iOS 開發是否要採用 React Native?iOSReact Native
- 7) React Native 整合到原生專案(iOS)React NativeiOS
- 如何配置React Native真機除錯-iOSReact Native除錯iOS
- [React Native]react-native-scrollabReact Native
- Swift iOS : @escaping 屬性SwiftiOSAPI