From c15434e0d237bd8e3e5912285c5836656bb1aae5 Mon Sep 17 00:00:00 2001
From: samarinsergey <samarin.sergey@huawei.com>
Date: Fri, 16 Feb 2024 15:28:47 +0300
Subject: [PATCH] [HOS-1952] Apply theme to Select component

---
 .../components/ComponentsNavigationPage.ets   |  4 ++
 .../main/ets/pages/components/SelectPage.ets  | 71 +++++++++++++++++++
 .../resources/base/profile/main_pages.json    |  1 +
 3 files changed, 76 insertions(+)
 create mode 100644 theme/ThemeDemo/entry/src/main/ets/pages/components/SelectPage.ets

diff --git a/theme/ThemeDemo/entry/src/main/ets/pages/components/ComponentsNavigationPage.ets b/theme/ThemeDemo/entry/src/main/ets/pages/components/ComponentsNavigationPage.ets
index 0b16815..368dbcc 100644
--- a/theme/ThemeDemo/entry/src/main/ets/pages/components/ComponentsNavigationPage.ets
+++ b/theme/ThemeDemo/entry/src/main/ets/pages/components/ComponentsNavigationPage.ets
@@ -41,6 +41,10 @@ struct ComponentsNavigationPage {
       title: 'Radio',
       page: 'pages/components/RadioPage'
     },
+    {
+      title: 'Select',
+      page: 'pages/components/SelectPage'
+    },
     {
       title: 'Slider',
       page: 'pages/components/SliderThemePage'
diff --git a/theme/ThemeDemo/entry/src/main/ets/pages/components/SelectPage.ets b/theme/ThemeDemo/entry/src/main/ets/pages/components/SelectPage.ets
new file mode 100644
index 0000000..7ee910d
--- /dev/null
+++ b/theme/ThemeDemo/entry/src/main/ets/pages/components/SelectPage.ets
@@ -0,0 +1,71 @@
+class SelectPageGreenColors implements CustomColors {
+  fontPrimary = '#FF00541F'
+  compBackgroundTertiary = '#3322FF22'
+  interactivePressed = '#FF4CDD82'
+}
+
+class SelectPageCustomTheme implements CustomTheme {
+  colors = new SelectPageGreenColors()
+}
+
+@Entry
+@Component
+struct SelectPage {
+  @State customTheme: CustomTheme | undefined = undefined
+  fruits: string[] = ['Apple', 'Orange', 'Peach']
+  normalSelectedIndex: number = 0
+  smallSelectedIndex: number = 0
+  greenTheme = new SelectPageCustomTheme()
+
+  isCustomTheme() {
+    return !(this.customTheme === undefined)
+  }
+
+  build() {
+    Row() {
+      Column({ space: '100vp' }) {
+        Column({ space: '8vp' }) {
+          Text(`Current theme: ${this.isCustomTheme() ? 'Custom' : 'System'}`)
+          Button('Change Theme')
+            .onClick(() => {
+              this.customTheme = this.isCustomTheme() ? undefined : this.greenTheme
+            })
+        }
+        Column({ space: '8vp' }) {
+          Text('Style: Normal')
+          WithTheme(this.customTheme) {
+            Select([
+              { value: this.fruits[0] },
+              { value: this.fruits[1] },
+              { value: this.fruits[2] }
+            ])
+              .selectStyleEx(SelectStyleEx.Normal)
+              .selected(this.normalSelectedIndex)
+              .value(this.fruits[this.normalSelectedIndex])
+              .onSelect((index: number, value: string) => {
+                this.normalSelectedIndex = index
+              })
+          }
+        }
+        Column({ space: '8vp' }) {
+          Text('Style: Small')
+          WithTheme(this.customTheme) {
+            Select([
+              { value: this.fruits[0] },
+              { value: this.fruits[1] },
+              { value: this.fruits[2] }
+            ])
+              .selectStyleEx(SelectStyleEx.Small)
+              .selected(this.smallSelectedIndex)
+              .value(this.fruits[this.smallSelectedIndex])
+              .onSelect((index: number, value: string) => {
+                this.smallSelectedIndex = index
+              })
+          }
+        }
+      }
+        .width('100%')
+    }
+      .height('100%')
+  }
+}
\ No newline at end of file
diff --git a/theme/ThemeDemo/entry/src/main/resources/base/profile/main_pages.json b/theme/ThemeDemo/entry/src/main/resources/base/profile/main_pages.json
index 4881ebe..77d3a2d 100644
--- a/theme/ThemeDemo/entry/src/main/resources/base/profile/main_pages.json
+++ b/theme/ThemeDemo/entry/src/main/resources/base/profile/main_pages.json
@@ -28,6 +28,7 @@
     "pages/components/MenuPage",
     "pages/components/ProgressThemePage",
     "pages/components/RadioPage",
+    "pages/components/SelectPage",
     "pages/components/SliderThemePage",
     "pages/components/TextPickerPage",
     "pages/components/TimePickerPage",
-- 
Gitee