-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
zhaoyang
committed
Mar 14, 2024
1 parent
fe6d024
commit cd2529c
Showing
23 changed files
with
420 additions
and
15 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,77 @@ | ||
| import { StyleSheet, Text, TouchableOpacity, View } from "react-native"; | ||
| import React from "react"; | ||
| import { getStatusBarHeight } from "app/utils/index"; | ||
| import HBImage from "../image/HBImage"; | ||
| import { px2dp } from "../../utils/ScreenUtils"; | ||
| import { Actions } from "react-native-router-flux"; | ||
|
|
||
| const BaseNavBar = ({ children, title, shouldHideBack, backClicked }) => { | ||
| return ( | ||
| // 状态+导航栏 容器 | ||
| <View style={styles.container}> | ||
| {/* 导航栏 */} | ||
| <View style={styles.navContainer}> | ||
| {/* left 返回按钮 */} | ||
| {shouldHideBack ? null : ( | ||
| <TouchableOpacity | ||
| style={{ width: 36, zIndex: 1 }} | ||
| onPress={() => { | ||
| backClicked ? backClicked() : Actions.pop(); | ||
| }} | ||
| > | ||
| <HBImage | ||
| source={require("app/img/navigationBar/icon-back-black.png")} | ||
| style={{ | ||
| marginLeft: px2dp(12), | ||
| width: 21, | ||
| height: 21, | ||
| marginTop: px2dp(1.5), | ||
| }} | ||
| /> | ||
| </TouchableOpacity> | ||
| )} | ||
|
|
||
| {/* 标题 */} | ||
| {title && ( | ||
| <View style={styles.titleContainer}> | ||
| <Text style={styles.title}>{title}</Text> | ||
| </View> | ||
| )} | ||
|
|
||
| {/* 其它内容 e.g.右侧按钮 */} | ||
| {children} | ||
| </View> | ||
| </View> | ||
| ); | ||
| }; | ||
|
|
||
| export default BaseNavBar; | ||
|
|
||
| const styles = StyleSheet.create({ | ||
| container: { | ||
| width: "100%", | ||
| height: getStatusBarHeight() + 44, | ||
| backgroundColor: "#fff", | ||
| }, | ||
|
|
||
| navContainer: { | ||
| width: "100%", | ||
| marginTop: getStatusBarHeight(), | ||
| height: 44, | ||
| backgroundColor: "#fff", | ||
| flexDirection: "row", | ||
| alignItems: "center", | ||
| }, | ||
| titleContainer: { | ||
| position: "absolute", | ||
| width: "100%", | ||
| justifyContent: "center", | ||
| alignItems: "center", | ||
| }, | ||
| title: { | ||
| fontSize: px2dp(18), | ||
| color: "#333", | ||
| textAlignVertical: "center", | ||
| lineHeight: 44, | ||
| }, | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,50 @@ | ||
| import React from "react"; | ||
| import HBImage from "app/components/image/HBImage"; | ||
| import { TouchableOpacity, View } from "react-native"; | ||
| import { px2dp } from "app/utils/ScreenUtils"; | ||
| import { Actions } from "react-native-router-flux"; | ||
| import * as indexUtil from "app/utils/index"; | ||
|
|
||
| /** | ||
| * 返回按钮 | ||
| * @param {*} props onPress, | ||
| * @returns | ||
| */ | ||
| const LeftUpBackButton = ({ onPress, iconType }) => { | ||
| return ( | ||
| <TouchableOpacity | ||
| style={{ | ||
| zIndex: 999, | ||
| position: "absolute", | ||
| top: indexUtil.getStatusBarHeight(), | ||
| width: px2dp(50), | ||
| height: 44, | ||
| justifyContent: "center", | ||
| left: 0, | ||
| }} | ||
| onPress={() => { | ||
| if (onPress) { | ||
| onPress(); | ||
| } else { | ||
| Actions.pop(); | ||
| } | ||
| }} | ||
| > | ||
| <HBImage | ||
| source={ | ||
| iconType == "white" | ||
| ? require("app/img/Status_bar_return.png") | ||
| : require("app/img/navigationBar/icon-back-black.png") | ||
| } | ||
| style={{ | ||
| marginLeft: px2dp(12), | ||
| width: px2dp(11), | ||
| height: px2dp(19), | ||
| marginTop: px2dp(1.5), | ||
| }} | ||
| /> | ||
| </TouchableOpacity> | ||
| ); | ||
| }; | ||
|
|
||
| export default LeftUpBackButton; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file removed
BIN
-391 KB
content/posts/rn/tool-npm-patch/media/16577664234885/16577697655622.jpg
Binary file not shown.
Binary file removed
BIN
-411 KB
content/posts/rn/tool-npm-patch/media/16577664234885/16577704857131.jpg
Binary file not shown.
Binary file removed
BIN
-471 KB
content/posts/rn/tool-npm-patch/media/16577664234885/16577831950941.jpg
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,77 @@ | ||
| import { StyleSheet, Text, TouchableOpacity, View } from "react-native"; | ||
| import React from "react"; | ||
| import { getStatusBarHeight } from "app/utils/index"; | ||
| import HBImage from "../image/HBImage"; | ||
| import { px2dp } from "../../utils/ScreenUtils"; | ||
| import { Actions } from "react-native-router-flux"; | ||
|
|
||
| const BaseNavBar = ({ children, title, shouldHideBack, backClicked }) => { | ||
| return ( | ||
| // 状态+导航栏 容器 | ||
| <View style={styles.container}> | ||
| {/* 导航栏 */} | ||
| <View style={styles.navContainer}> | ||
| {/* left 返回按钮 */} | ||
| {shouldHideBack ? null : ( | ||
| <TouchableOpacity | ||
| style={{ width: 36, zIndex: 1 }} | ||
| onPress={() => { | ||
| backClicked ? backClicked() : Actions.pop(); | ||
| }} | ||
| > | ||
| <HBImage | ||
| source={require("app/img/navigationBar/icon-back-black.png")} | ||
| style={{ | ||
| marginLeft: px2dp(12), | ||
| width: 21, | ||
| height: 21, | ||
| marginTop: px2dp(1.5), | ||
| }} | ||
| /> | ||
| </TouchableOpacity> | ||
| )} | ||
|
|
||
| {/* 标题 */} | ||
| {title && ( | ||
| <View style={styles.titleContainer}> | ||
| <Text style={styles.title}>{title}</Text> | ||
| </View> | ||
| )} | ||
|
|
||
| {/* 其它内容 e.g.右侧按钮 */} | ||
| {children} | ||
| </View> | ||
| </View> | ||
| ); | ||
| }; | ||
|
|
||
| export default BaseNavBar; | ||
|
|
||
| const styles = StyleSheet.create({ | ||
| container: { | ||
| width: "100%", | ||
| height: getStatusBarHeight() + 44, | ||
| backgroundColor: "#fff", | ||
| }, | ||
|
|
||
| navContainer: { | ||
| width: "100%", | ||
| marginTop: getStatusBarHeight(), | ||
| height: 44, | ||
| backgroundColor: "#fff", | ||
| flexDirection: "row", | ||
| alignItems: "center", | ||
| }, | ||
| titleContainer: { | ||
| position: "absolute", | ||
| width: "100%", | ||
| justifyContent: "center", | ||
| alignItems: "center", | ||
| }, | ||
| title: { | ||
| fontSize: px2dp(18), | ||
| color: "#333", | ||
| textAlignVertical: "center", | ||
| lineHeight: 44, | ||
| }, | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,50 @@ | ||
| import React from "react"; | ||
| import HBImage from "app/components/image/HBImage"; | ||
| import { TouchableOpacity, View } from "react-native"; | ||
| import { px2dp } from "app/utils/ScreenUtils"; | ||
| import { Actions } from "react-native-router-flux"; | ||
| import * as indexUtil from "app/utils/index"; | ||
|
|
||
| /** | ||
| * 返回按钮 | ||
| * @param {*} props onPress, | ||
| * @returns | ||
| */ | ||
| const LeftUpBackButton = ({ onPress, iconType }) => { | ||
| return ( | ||
| <TouchableOpacity | ||
| style={{ | ||
| zIndex: 999, | ||
| position: "absolute", | ||
| top: indexUtil.getStatusBarHeight(), | ||
| width: px2dp(50), | ||
| height: 44, | ||
| justifyContent: "center", | ||
| left: 0, | ||
| }} | ||
| onPress={() => { | ||
| if (onPress) { | ||
| onPress(); | ||
| } else { | ||
| Actions.pop(); | ||
| } | ||
| }} | ||
| > | ||
| <HBImage | ||
| source={ | ||
| iconType == "white" | ||
| ? require("app/img/Status_bar_return.png") | ||
| : require("app/img/navigationBar/icon-back-black.png") | ||
| } | ||
| style={{ | ||
| marginLeft: px2dp(12), | ||
| width: px2dp(11), | ||
| height: px2dp(19), | ||
| marginTop: px2dp(1.5), | ||
| }} | ||
| /> | ||
| </TouchableOpacity> | ||
| ); | ||
| }; | ||
|
|
||
| export default LeftUpBackButton; |
Oops, something went wrong.