ReactNative 使用react-navigation Android 標題欄標題居中適配
原因
在使用react-navigation設定標題欄的標題過程中發現,在iphone上標題欄的標題為居中狀態,而在Android上則是居左對齊。當有headerLeft或者headerRight設定後,中間的標題會根據剩餘的空間居中顯示。所以需要我們修改原始碼,進行適配。
修改原始碼
- 【node_modules -- react-navigation -- src -- views -- Header.js】的326行程式碼處,修改為如下:
title: {
bottom: 0,
left: TITLE_OFFSET,
right: TITLE_OFFSET,
top: 0,
position: 'absolute',
alignItems: 'center',
- 註釋掉170行的內容
// if (Platform.OS === 'android') {
// if (!options.hasLeftComponent) {
// style.left = 0;
// }
// if (!options.hasRightComponent) {
// style.right = 0;
// }
// } }
相關文章
- Qt隱藏系統標題欄,使用自定義標題欄QT
- Android studio | 去除頂部標題欄Android
- AppCompatActivity隱藏標題欄APP
- Android中取消系統標題欄的幾種方式Android
- Android懸浮框的適配問題Android
- 適配問題
- 解決UILable標點符號居中的問題UI符號
- Android全面屏虛擬導航欄適配Android
- 聊天平臺原始碼,Android 解決menu彈出蓋住標題欄原始碼Android
- 聊天平臺原始碼,標題過長自動應用摺疊式標題欄原始碼
- 視訊直播系統原始碼,頂部標題欄的隱藏和標題修改原始碼
- 測試標題測試標題
- 影片直播原始碼,標題居中,底部按鈕為三個時居中佈局原始碼
- Android適配Android
- 直播app開發,封裝式標題欄APP封裝
- 標題
- 移動APP測試-Android螢幕適配問題(一)APPAndroid
- 移動APP測試:Android螢幕適配問題二APPAndroid
- 直播系統平臺搭建適配Android WebView 深色主題AndroidWebView
- Android適配: 拉伸適配的缺點Android
- 移動端適配問題
- HTML標題HTML
- 無標題
- HTML 標題HTML
- 設定Android程式圖示和程式標題Android
- jQuery 項卡標題欄閃爍提示新資訊jQuery
- chrome刪除 標題欄滑鼠懸停提示網址Chrome
- Android的標題欄,狀態列圖示文字顏色及背景動態變化Android
- Android 二次最佳化個人封裝新聞可滑動標題欄Android封裝
- Android圖示適配Android
- android 螢幕適配Android
- android全面屏適配Android
- Android P 適配指南Android
- 手機端的適配問題
- 記一個 Android 14 適配引發的Android 儲存許可權問題Android
- 博文標題
- 這是標題
- 測試標題
- uni-app動態修改頂部導航欄標題APP