developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
wangliang_wd
5ddfe93c 1 parent 55861339

feat:优化折叠屏UI

Inline Side-by-side
Showing 4 changed files with 46 additions and 48 deletions
@@ -36,6 +36,7 @@ struct GuidePages { @@ -36,6 +36,7 @@ struct GuidePages {
36 ChildItem(index: number) { 36 ChildItem(index: number) {
37 RelativeContainer() { 37 RelativeContainer() {
38 Image(this.guideImage[index]) 38 Image(this.guideImage[index])
  39 + .objectFit(ImageFit.Contain)
39 .alignRules({ 40 .alignRules({
40 top: { anchor: "__container__", align: VerticalAlign.Top }, 41 top: { anchor: "__container__", align: VerticalAlign.Top },
41 bottom: { anchor: "__container__", align: VerticalAlign.Bottom } 42 bottom: { anchor: "__container__", align: VerticalAlign.Bottom }
@@ -91,11 +91,11 @@ struct LaunchAdvertisingPage { @@ -91,11 +91,11 @@ struct LaunchAdvertisingPage {
91 Text('广告') 91 Text('广告')
92 .fontColor(Color.White) 92 .fontColor(Color.White)
93 .textAlign(TextAlign.Center) 93 .textAlign(TextAlign.Center)
94 - .fontSize('24lpx')  
95 - .width('72lpx')  
96 - .height('36lpx') 94 + .fontSize(12)
  95 + .width(36)
  96 + .height(18)
97 .borderRadius(2) 97 .borderRadius(2)
98 - .margin({top:'15lpx',left:'19lpx'}) 98 + .margin({top:'8px',left:'10px'})
99 .backgroundColor('#80000000') 99 .backgroundColor('#80000000')
100 .margin({left:16}) 100 .margin({left:16})
101 } 101 }
@@ -104,13 +104,13 @@ struct LaunchAdvertisingPage { @@ -104,13 +104,13 @@ struct LaunchAdvertisingPage {
104 104
105 Button(){ 105 Button(){
106 Text(this.time + 's 跳过') 106 Text(this.time + 's 跳过')
107 - .fontSize('27lpx') 107 + .fontSize(14)
108 .fontColor(Color.White) 108 .fontColor(Color.White)
109 - .margin({left:'28lpx',right:'28lpx'}) 109 + .margin({left:14,right:14})
110 } 110 }
111 - .width('148lpx')  
112 - .height('56lpx')  
113 - .margin({top:'10lpx',right:'19lpx'}) 111 + .width(74)
  112 + .height(28)
  113 + .margin({top:5,right:10})
114 .backgroundColor('#80000000') 114 .backgroundColor('#80000000')
115 .onClick(() => { 115 .onClick(() => {
116 this.trackingLaunchJumpOver() 116 this.trackingLaunchJumpOver()
@@ -125,21 +125,21 @@ struct LaunchAdvertisingPage { @@ -125,21 +125,21 @@ struct LaunchAdvertisingPage {
125 Button(){ 125 Button(){
126 Row(){ 126 Row(){
127 Text(this.defaultModel.isAd == '1'?'点击跳转至详情或第三方应用':'点击跳转至详情') 127 Text(this.defaultModel.isAd == '1'?'点击跳转至详情或第三方应用':'点击跳转至详情')
128 - .fontSize('31lpx') 128 + .fontSize(16)
129 .fontColor(Color.White) 129 .fontColor(Color.White)
130 .margin({ 130 .margin({
131 - left:'55lpx' 131 + left:28
132 }) 132 })
133 Image($r('app.media.Slice')) 133 Image($r('app.media.Slice'))
134 - .width('46lpx')  
135 - .height('46lpx')  
136 - .margin({right:'55lpx'}) 134 + .width(28)
  135 + .height(23)
  136 + .margin({right:28})
137 }.alignItems(VerticalAlign.Center) 137 }.alignItems(VerticalAlign.Center)
138 } 138 }
139 - .width('566lpx')  
140 - .height('111lpx') 139 + .width(284)
  140 + .height(56)
141 .margin({ 141 .margin({
142 - bottom: '51lpx' 142 + bottom: 26
143 }) 143 })
144 .borderWidth(1) 144 .borderWidth(1)
145 .borderColor(Color.White) 145 .borderColor(Color.White)
@@ -151,8 +151,8 @@ struct LaunchAdvertisingPage { @@ -151,8 +151,8 @@ struct LaunchAdvertisingPage {
151 if(this.defaultModel.screenType == '1') { 151 if(this.defaultModel.screenType == '1') {
152 Column(){ 152 Column(){
153 Image($r('app.media.LaunchPage_logo')) 153 Image($r('app.media.LaunchPage_logo'))
154 - .width('278lpx')  
155 - .height('154lpx') 154 + .width(140)
  155 + .height(77)
156 .margin({top:20}) 156 .margin({top:20})
157 }.width('100%').height('16%').backgroundColor(Color.White) 157 }.width('100%').height('16%').backgroundColor(Color.White)
158 // .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM]) 158 // .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
@@ -40,11 +40,11 @@ struct LaunchInterestsHobbiesPage { @@ -40,11 +40,11 @@ struct LaunchInterestsHobbiesPage {
40 Row(){ 40 Row(){
41 Blank() 41 Blank()
42 Text('跳过') 42 Text('跳过')
43 - .fontSize('27lpx') 43 + .fontSize(14)
44 .fontColor('#333333') 44 .fontColor('#333333')
45 - .width('54lpx')  
46 - .height('35lpx')  
47 - .margin({top:'30lpx',right:'46lpx'}) 45 + .width(30)
  46 + .height(18)
  47 + .margin({top:15,right:23})
48 .onClick(()=>{ 48 .onClick(()=>{
49 //直接跳过到首页 49 //直接跳过到首页
50 //跳转首页 50 //跳转首页
@@ -58,20 +58,20 @@ struct LaunchInterestsHobbiesPage { @@ -58,20 +58,20 @@ struct LaunchInterestsHobbiesPage {
58 .justifyContent(FlexAlign.End) 58 .justifyContent(FlexAlign.End)
59 59
60 Text('选择感兴趣的内容') 60 Text('选择感兴趣的内容')
61 - .fontSize('46lpx') 61 + .fontSize(23)
62 .fontWeight(FontWeight.Bold) 62 .fontWeight(FontWeight.Bold)
63 .textAlign(TextAlign.Center) 63 .textAlign(TextAlign.Center)
64 .fontColor('#333333') 64 .fontColor('#333333')
65 .width('100%') 65 .width('100%')
66 - .height('61lpx')  
67 - .margin({top:'54lpx'}) 66 + .height(30)
  67 + .margin({top:27})
68 Text('完善信息,将为您推荐个性化的内容') 68 Text('完善信息,将为您推荐个性化的内容')
69 - .fontSize('27lpx') 69 + .fontSize(14)
70 .textAlign(TextAlign.Center) 70 .textAlign(TextAlign.Center)
71 .fontColor('#9E9E9E') 71 .fontColor('#9E9E9E')
72 .width('100%') 72 .width('100%')
73 - .height('35lpx')  
74 - .margin({top:'12lpx'}) 73 + .height(17)
  74 + .margin({top:6})
75 75
76 if(!this.isConnectNetwork){ 76 if(!this.isConnectNetwork){
77 EmptyComponent({ emptyType: 1,emptyHeight:"60%" ,retry: () => { 77 EmptyComponent({ emptyType: 1,emptyHeight:"60%" ,retry: () => {
@@ -141,39 +141,36 @@ struct LaunchInterestsHobbiesPage { @@ -141,39 +141,36 @@ struct LaunchInterestsHobbiesPage {
141 }) 141 })
142 } 142 }
143 .width('90%') 143 .width('90%')
144 - .margin({top:'61lpx',bottom:'300lpx'}) 144 + .margin({top:30,bottom:150})
145 .columnsTemplate('1fr 1fr 1fr') 145 .columnsTemplate('1fr 1fr 1fr')
146 .columnsGap('23lpx') 146 .columnsGap('23lpx')
147 .rowsGap('23lpx') 147 .rowsGap('23lpx')
148 .scrollBar(BarState.Off) 148 .scrollBar(BarState.Off)
149 } 149 }
150 -  
151 -  
152 } 150 }
153 .width('100%') 151 .width('100%')
154 .height('100%') 152 .height('100%')
155 } 153 }
156 .width('100%') 154 .width('100%')
157 - .height(`calc(100% - ${158 + 'lpx'})`)  
158 - // .backgroundColor(Color.Red) 155 + .height(`calc(100% - ${260 + 'px'})`)
159 156
160 Stack({alignContent:Alignment.Center}){ 157 Stack({alignContent:Alignment.Center}){
161 Button(this.selectCount == 0?'选好了':'选好了(' + this.selectCount + ')') 158 Button(this.selectCount == 0?'选好了':'选好了(' + this.selectCount + ')')
162 - .fontSize('35lpx') 159 + .fontSize(18)
163 .fontColor('#FFFFFF') 160 .fontColor('#FFFFFF')
164 .backgroundColor('#ED2800') 161 .backgroundColor('#ED2800')
165 .type(ButtonType.Normal) 162 .type(ButtonType.Normal)
166 - .borderRadius('10lpx')  
167 - .width('662lpx')  
168 - .height('84lpx')  
169 - .margin({top:'10lpx'}) 163 + .borderRadius(5)
  164 + .width(320)
  165 + .height(44)
  166 + .margin({top:5})
170 Image('') 167 Image('')
171 - .width('662lpx')  
172 - .height('84lpx')  
173 - .margin({top:'10lpx'}) 168 + .width(320)
  169 + .height(44)
  170 + .margin({top:5})
174 .backgroundColor(Color.White) 171 .backgroundColor(Color.White)
175 .opacity(this.selectCount == 0 ? 0.6 : 0) 172 .opacity(this.selectCount == 0 ? 0.6 : 0)
176 - .borderRadius('10lpx') 173 + .borderRadius(5)
177 .onClick(()=>{ 174 .onClick(()=>{
178 if (this.selectCount == 0) { 175 if (this.selectCount == 0) {
179 this.dialogToast.open() 176 this.dialogToast.open()
@@ -188,8 +185,8 @@ struct LaunchInterestsHobbiesPage { @@ -188,8 +185,8 @@ struct LaunchInterestsHobbiesPage {
188 }) 185 })
189 } 186 }
190 .width('100%') 187 .width('100%')
191 - .height('108lpx')  
192 - .margin({top:0}) 188 + .height(54)
  189 + .margin({top:5})
193 // .backgroundColor(Color.Orange) 190 // .backgroundColor(Color.Orange)
194 } 191 }
195 .width('100%') 192 .width('100%')
@@ -166,10 +166,10 @@ struct LaunchPage { @@ -166,10 +166,10 @@ struct LaunchPage {
166 166
167 Stack({alignContent:Alignment.Bottom}){ 167 Stack({alignContent:Alignment.Bottom}){
168 Image($r('app.media.LaunchPage_logo')) 168 Image($r('app.media.LaunchPage_logo'))
169 - .width('278lpx')  
170 - .height('154lpx') 169 + .width(139)
  170 + .height(87)
171 .margin({ 171 .margin({
172 - bottom:'48lpx' 172 + bottom:24
173 }) 173 })
174 174
175 } 175 }