|
@@ -17,6 +17,8 @@ export struct SafeView {
|
|
|
@Prop isImmersive: boolean
|
|
|
// 设置导航栏标题
|
|
|
@Prop titleText: ResourceStr
|
|
|
+ // 设置导航栏标题颜色
|
|
|
+ @Prop titleColor: ResourceColor
|
|
|
// 设置导航栏背景色
|
|
|
@Prop backgroundColorNav: ResourceColor
|
|
|
// 设置导航栏背景色
|
|
@@ -26,6 +28,8 @@ export struct SafeView {
|
|
|
@Prop opacitys: number | Resource
|
|
|
// 是否显示返回按钮
|
|
|
@Prop hideBack: boolean
|
|
|
+ // 是否显示返回按钮
|
|
|
+ @Prop hideNavBar: boolean
|
|
|
/**
|
|
|
* 是否显示左侧角标,存在onClickLeft时生效
|
|
|
*/
|
|
@@ -59,133 +63,135 @@ export struct SafeView {
|
|
|
.width('100%')
|
|
|
.height('100%')
|
|
|
|
|
|
- Row()
|
|
|
- .height(WindowHelper.topRectHeight)
|
|
|
- .width('100%')
|
|
|
- .backgroundColor(this.backgroundColorNav ?? '#ffffff')
|
|
|
- .opacity(undefined === this.opacitys ? 1 : this.opacitys > 1 ? 1 : this.opacitys < 0 ? 0 : this.opacitys)
|
|
|
-
|
|
|
- Row() {
|
|
|
+ if (!this.hideNavBar) {
|
|
|
+ Row()
|
|
|
+ .height(WindowHelper.topRectHeight)
|
|
|
+ .width('100%')
|
|
|
+ .backgroundColor(this.backgroundColorNav ?? '#ffffff')
|
|
|
+ .opacity(undefined === this.opacitys ? 1 : this.opacitys > 1 ? 1 : this.opacitys < 0 ? 0 : this.opacitys)
|
|
|
|
|
|
Row() {
|
|
|
- Image($r("app.media.base_back"))
|
|
|
- .height(15)
|
|
|
- .objectFit(ImageFit.Contain).visibility(!this.hideBack ? Visibility.Visible : Visibility.None)
|
|
|
- }.width(110)
|
|
|
- .onClick(() => {
|
|
|
- if (this.hideBack) {
|
|
|
- return
|
|
|
- }
|
|
|
- if (this.onBackEvent && !this.hideBack) {
|
|
|
- this.onBackEvent()
|
|
|
- } else if (this.pageInfos) {
|
|
|
- this.pageInfos.pop()
|
|
|
- }
|
|
|
- })
|
|
|
|
|
|
- Text(this.titleText ?? '')
|
|
|
- .maxLines(1)
|
|
|
- .fontColor('#11102C')
|
|
|
- .fontSize(16)
|
|
|
- .fontWeight(FontWeight.Medium)
|
|
|
- .ellipsisMode(EllipsisMode.CENTER)
|
|
|
- .textOverflow({
|
|
|
- overflow: TextOverflow.Ellipsis
|
|
|
- })
|
|
|
- .constraintSize({
|
|
|
- maxWidth: 120
|
|
|
+ Row() {
|
|
|
+ Image($r("app.media.base_back"))
|
|
|
+ .height(15)
|
|
|
+ .objectFit(ImageFit.Contain).visibility(!this.hideBack ? Visibility.Visible : Visibility.None)
|
|
|
+ }.width(110)
|
|
|
+ .onClick(() => {
|
|
|
+ if (this.hideBack) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (this.onBackEvent && !this.hideBack) {
|
|
|
+ this.onBackEvent()
|
|
|
+ } else if (this.pageInfos) {
|
|
|
+ this.pageInfos.pop()
|
|
|
+ }
|
|
|
})
|
|
|
|
|
|
- Row() {
|
|
|
- if (!this.onClickLeft?.img && this.onClickLeft) {
|
|
|
- Badge({
|
|
|
- count: this.showBadgeLeft ? 1 : 0,
|
|
|
- style: {
|
|
|
- badgeSize: 6,
|
|
|
- badgeColor: Color.Red
|
|
|
+ Text(this.titleText ?? '')
|
|
|
+ .maxLines(1)
|
|
|
+ .fontColor(this.titleColor ?? '#11102C')
|
|
|
+ .fontSize(16)
|
|
|
+ .fontWeight(FontWeight.Medium)
|
|
|
+ .ellipsisMode(EllipsisMode.CENTER)
|
|
|
+ .textOverflow({
|
|
|
+ overflow: TextOverflow.Ellipsis
|
|
|
+ })
|
|
|
+ .constraintSize({
|
|
|
+ maxWidth: 120
|
|
|
+ })
|
|
|
+
|
|
|
+ Row() {
|
|
|
+ if (!this.onClickLeft?.img && this.onClickLeft) {
|
|
|
+ Badge({
|
|
|
+ count: this.showBadgeLeft ? 1 : 0,
|
|
|
+ style: {
|
|
|
+ badgeSize: 6,
|
|
|
+ badgeColor: Color.Red
|
|
|
+ }
|
|
|
+ }) {
|
|
|
+ Text(`${this.onClickLeft?.text}` ?? '确定')
|
|
|
+ .fontColor(this.onClickLeft?.color ?? '#17171A')
|
|
|
+ .onClick(() => {
|
|
|
+ this.onClickLeft?.onClick && this.onClickLeft?.onClick()
|
|
|
+ })
|
|
|
}
|
|
|
- }) {
|
|
|
- Text(`${this.onClickLeft?.text}` ?? '确定')
|
|
|
- .fontColor(this.onClickLeft?.color ?? '#17171A')
|
|
|
- .onClick(() => {
|
|
|
- this.onClickLeft?.onClick && this.onClickLeft?.onClick()
|
|
|
- })
|
|
|
}
|
|
|
- }
|
|
|
- if (this.onClickLeft?.img && this.onClickLeft) {
|
|
|
- Badge({
|
|
|
- count: this.showBadgeLeft ? 1 : 0,
|
|
|
- style: {
|
|
|
- badgeSize: 6,
|
|
|
- badgeColor: '#FF6500',
|
|
|
- color: '#FF6500'
|
|
|
+ if (this.onClickLeft?.img && this.onClickLeft) {
|
|
|
+ Badge({
|
|
|
+ count: this.showBadgeLeft ? 1 : 0,
|
|
|
+ style: {
|
|
|
+ badgeSize: 6,
|
|
|
+ badgeColor: '#FF6500',
|
|
|
+ color: '#FF6500'
|
|
|
+ }
|
|
|
+ }) {
|
|
|
+ Image(this.onClickLeft.img)
|
|
|
+ .onClick(() => {
|
|
|
+ this.onClickLeft?.onClick && this.onClickLeft?.onClick()
|
|
|
+ })
|
|
|
+ .objectFit(ImageFit.Contain)
|
|
|
+ .width(20)
|
|
|
+ .height(20)
|
|
|
}
|
|
|
- }) {
|
|
|
- Image(this.onClickLeft.img)
|
|
|
- .onClick(() => {
|
|
|
- this.onClickLeft?.onClick && this.onClickLeft?.onClick()
|
|
|
- })
|
|
|
- .objectFit(ImageFit.Contain)
|
|
|
- .width(20)
|
|
|
- .height(20)
|
|
|
}
|
|
|
- }
|
|
|
- if (!this.onClickRight?.img && this.onClickRight) {
|
|
|
- Badge({
|
|
|
- count: this.showBadgeRight ? 1 : 0,
|
|
|
- style: {
|
|
|
- badgeSize: 6,
|
|
|
- badgeColor: '#FF6500',
|
|
|
- color: '#FF6500'
|
|
|
+ if (!this.onClickRight?.img && this.onClickRight) {
|
|
|
+ Badge({
|
|
|
+ count: this.showBadgeRight ? 1 : 0,
|
|
|
+ style: {
|
|
|
+ badgeSize: 6,
|
|
|
+ badgeColor: '#FF6500',
|
|
|
+ color: '#FF6500'
|
|
|
+ }
|
|
|
+ }) {
|
|
|
+ Text(this.onClickRight?.text ?? '确定')
|
|
|
+ .fontColor(this.onClickRight?.color ?? '#17171A')
|
|
|
+ .onClick(() => {
|
|
|
+ this.onClickRight?.onClick && this.onClickRight?.onClick()
|
|
|
+ })
|
|
|
+ .margin({
|
|
|
+ left: 10
|
|
|
+ })
|
|
|
}
|
|
|
- }) {
|
|
|
- Text(this.onClickRight?.text ?? '确定')
|
|
|
- .fontColor(this.onClickRight?.color ?? '#17171A')
|
|
|
- .onClick(() => {
|
|
|
- this.onClickRight?.onClick && this.onClickRight?.onClick()
|
|
|
- })
|
|
|
- .margin({
|
|
|
- left: 10
|
|
|
- })
|
|
|
}
|
|
|
- }
|
|
|
- if (this.onClickRight?.img && this.onClickRight) {
|
|
|
- Badge({
|
|
|
- count: this.showBadgeRight ? 1 : 0,
|
|
|
- style: {
|
|
|
- badgeSize: 6,
|
|
|
- badgeColor: '#FF6500',
|
|
|
- color: '#FF6500'
|
|
|
+ if (this.onClickRight?.img && this.onClickRight) {
|
|
|
+ Badge({
|
|
|
+ count: this.showBadgeRight ? 1 : 0,
|
|
|
+ style: {
|
|
|
+ badgeSize: 6,
|
|
|
+ badgeColor: '#FF6500',
|
|
|
+ color: '#FF6500'
|
|
|
+ }
|
|
|
+ }) {
|
|
|
+ Image(this.onClickRight.img)
|
|
|
+ .onClick(() => {
|
|
|
+ this.onClickRight?.onClick && this.onClickRight?.onClick()
|
|
|
+ })
|
|
|
+ .objectFit(ImageFit.Contain)
|
|
|
+ .width(20)
|
|
|
+ .height(20)
|
|
|
+ .margin({
|
|
|
+ left: 10
|
|
|
+ })
|
|
|
}
|
|
|
- }) {
|
|
|
- Image(this.onClickRight.img)
|
|
|
- .onClick(() => {
|
|
|
- this.onClickRight?.onClick && this.onClickRight?.onClick()
|
|
|
- })
|
|
|
- .objectFit(ImageFit.Contain)
|
|
|
- .width(20)
|
|
|
- .height(20)
|
|
|
- .margin({
|
|
|
- left: 10
|
|
|
- })
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- }.width(110)
|
|
|
- .justifyContent(FlexAlign.End)
|
|
|
+ }.width(110)
|
|
|
+ .justifyContent(FlexAlign.End)
|
|
|
+ }
|
|
|
+ .backgroundColor(this.backgroundColorNav ?? '#ffffff')
|
|
|
+ .opacity(undefined === this.opacitys ? 1 : this.opacitys > 1 ? 1 : this.opacitys < 0 ? 0 : this.opacitys)
|
|
|
+ .justifyContent(FlexAlign.SpaceBetween)
|
|
|
+ .height(44)
|
|
|
+ .padding({
|
|
|
+ left: 15,
|
|
|
+ right: 15
|
|
|
+ })
|
|
|
+ .width('100%')
|
|
|
+ .margin({
|
|
|
+ top: WindowHelper.topRectHeight
|
|
|
+ })
|
|
|
}
|
|
|
- .backgroundColor(this.backgroundColorNav ?? '#ffffff')
|
|
|
- .opacity(undefined === this.opacitys ? 1 : this.opacitys > 1 ? 1 : this.opacitys < 0 ? 0 : this.opacitys)
|
|
|
- .justifyContent(FlexAlign.SpaceBetween)
|
|
|
- .height(44)
|
|
|
- .padding({
|
|
|
- left: 15,
|
|
|
- right: 15
|
|
|
- })
|
|
|
- .width('100%')
|
|
|
- .margin({
|
|
|
- top: WindowHelper.topRectHeight
|
|
|
- })
|
|
|
|
|
|
Column() {
|
|
|
LoadingProgress()
|