加入q群的布局优化

entry/src/main/ets/pages/SettingPage.ets

@@ -289,37 +289,38 @@ export struct SettingPage {
             .height(55)
 
             Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
+            Button({ type: ButtonType.Normal, stateEffect: true }) {
+              Row() {
+                Text('自定义背景')
+                  .margin({ left: 18 })
+                  .fontSize(15)
+                  .fontColor(Color.Gray)
+                  .fontWeight(480)
+                  .layoutWeight(1)
+                  .bindSheet($$this.isCustomizeBgSheet, this.customizeBgSheet(), {
+                    height: '90%',
+                    dragBar: true,
+                    preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
+                    showClose: true,
+                    blurStyle: BlurStyle.Thin,
+                    backgroundColor: Color.Transparent,
+                    title: { title: '自定义背景' }
+                  })
 
-            Row() {
-              Text('自定义背景')
-                .margin({ left: 18 })
-                .fontSize(15)
-                .fontColor(Color.Gray)
-                .fontWeight(480)
-                .layoutWeight(1)
-                .bindSheet($$this.isCustomizeBgSheet, this.customizeBgSheet(), {
-                  height: '90%',
-                  dragBar: true,
-                  preferType: this.currentBreakpoint!==BreakpointTypeEnum.SM?SheetType.CENTER:SheetType.BOTTOM,
-                  showClose: true,
-                  blurStyle: BlurStyle.Thin,
-                  backgroundColor: Color.Transparent,
-                  title: { title: '自定义背景' }
-                })
-
-              Blank()
-              // 右侧箭头
-              Image($r('app.media.arrow_right'))
-                .width(22)
-                .height(22)
-                .margin({ left: 20, right: 20 })
-                .align(Alignment.Center)
+                Blank()
+                // 右侧箭头
+                Image($r('app.media.arrow_right'))
+                  .width(22)
+                  .height(22)
+                  .margin({ left: 20, right: 20 })
+                  .align(Alignment.Center)
+              }
             }
             .height(55)
             .onClick(() => {
               this.isCustomizeBgSheet = !this.isCustomizeBgSheet;
             })
-
+            .backgroundColor(Color.Transparent)
             Line().width('100%').height(0.3).backgroundColor($r('app.color.index_tab_unselected_font_color'))
 
             // 滚动隐藏'
@@ -679,30 +680,49 @@ export struct SettingPage {
             .justifyContent(FlexAlign.Center)
             .height(55)
 
-            Row() {
-              Text('API设置教程:')
-                .margin({ left: 18, right: 6 })
-                .fontSize(15)
-                .fontColor(Color.Gray)
-              Text('点击进Q群讨论：685109858')
-                .margin({ right: 10 })
-                .fontSize(15)
-                .fontColor(Color.Gray)
-                .layoutWeight(1)
-            }
-            .onClick(() => {
-              const qqUrl = `mqqapi://card/show_pslcard?src_type=internal&version=1&uin=${CommonConstants.QQ_GROUP}&card_type=group&source=external`;
-              let context = this.getUIContext().getHostContext() as common.UIAbilityContext;
-              context.openLink(qqUrl, {})
-            })
-            .justifyContent(FlexAlign.Center)
-            .height(55)
+
           }
           .backgroundColor($r('app.color.settings_background_main'))
           .borderRadius(20)
           .margin({ left: 0, right: 0, top: 10, bottom: 20 })
           .padding(0)
 
+          Button({ type: ButtonType.Capsule, stateEffect: true }) {
+            Column() {
+              Row() {
+                Text('设置教程:')
+                  .margin({ left: 18 })
+                  .fontSize(15)
+                  .fontColor(Color.Gray)
+                  .fontWeight(480)
+                Text('点击进Q群讨论')
+                  .margin({ right: 10 })
+                  .fontSize(15)
+                  .fontColor(Color.Gray)
+                  .layoutWeight(1)
+                Blank()
+                // 右侧箭头
+                Image($r('app.media.arrow_right'))
+                  .width(22)
+                  .height(22)
+                  .margin({ left: 20, right: 20 })
+                  .align(Alignment.Center)
+              }
+              .height(55)
+
+            }
+          }
+          .onClick(() => {
+            const qqUrl = `mqqapi://card/show_pslcard?src_type=internal&version=1&uin=${CommonConstants.QQ_GROUP}&card_type=group&source=external`;
+            let context = this.getUIContext().getHostContext() as common.UIAbilityContext;
+            context.openLink(qqUrl, {})
+          })
+          .backgroundColor($r('app.color.settings_background_main'))
+          .borderRadius(15)
+          .margin({  top: 0, bottom: 20 })
+          .padding(0)
+
+
           //空白
           Column() {
             Blank()