diff --git a/UI/Picker/README_zh.md b/UI/Picker/README_zh.md
new file mode 100644
index 0000000000000000000000000000000000000000..8022f5bf602aa0625f0cb064f1eae662306a8cdf
--- /dev/null
+++ b/UI/Picker/README_zh.md
@@ -0,0 +1,13 @@
+# 滑动选择器
+
+### 简介
+
+本示例展示<picker>组件的使用方法，实现了普通选择器，日期选择器，时间选择器，时间日期选择器，多列文本选择器。
+
+### 使用说明
+
+点击各个显示框中的文本内容，弹出对应选择器，在选择器中选择任意值，点击确定后文本显示框中会显示所选择的值。
+
+### 约束与限制
+
+本示例仅支持标准系统上运行
\ No newline at end of file
diff --git a/UI/Picker/build.gradle b/UI/Picker/build.gradle
new file mode 100644
index 0000000000000000000000000000000000000000..c3f3ef69e87fa254198e144c7a94775654584c77
--- /dev/null
+++ b/UI/Picker/build.gradle
@@ -0,0 +1,37 @@
+// Top-level build file where you can add configuration options common to all sub-projects/modules.
+apply plugin: 'com.huawei.ohos.app'
+
+//For instructions on signature configuration, see https://developer.harmonyos.com/cn/docs/documentation/doc-guides/ide_debug_device-0000001053822404#ZH-CN_TOPIC_0000001154985555__section1112183053510
+ohos {
+    compileSdkVersion 6
+    defaultConfig {
+        compatibleSdkVersion 6
+    }
+}
+
+buildscript {
+    repositories {
+        maven {
+            url 'https://repo.huaweicloud.com/repository/maven/'
+        }
+        maven {
+            url 'https://developer.huawei.com/repo/'
+        }
+        jcenter()
+    }
+    dependencies {
+        classpath 'com.huawei.ohos:hap:2.4.4.3-RC'
+    }
+}
+
+allprojects {
+    repositories {
+        maven {
+            url 'https://repo.huaweicloud.com/repository/maven/'
+        }
+        maven {
+            url 'https://developer.huawei.com/repo/'
+        }
+        jcenter()
+    }
+}
diff --git a/UI/Picker/entry/build.gradle b/UI/Picker/entry/build.gradle
new file mode 100644
index 0000000000000000000000000000000000000000..8181d84eae83f6e584f524893fff06d2e0d4f750
--- /dev/null
+++ b/UI/Picker/entry/build.gradle
@@ -0,0 +1,18 @@
+apply plugin: 'com.huawei.ohos.hap'
+
+//For instructions on signature configuration, see https://developer.harmonyos.com/cn/docs/documentation/doc-guides/ide_debug_device-0000001053822404#ZH-CN_TOPIC_0000001154985555__section1112183053510
+ohos {
+    compileSdkVersion 6
+    defaultConfig {
+        compatibleSdkVersion 6
+    }
+    buildTypes {
+        release {
+            proguardOpt {
+                proguardEnabled false
+                rulesFiles 'proguard-rules.pro'
+            }
+        }
+    }
+    supportSystem "standard"
+}
\ No newline at end of file
diff --git a/UI/Picker/entry/src/main/config.json b/UI/Picker/entry/src/main/config.json
new file mode 100644
index 0000000000000000000000000000000000000000..a22272e6bb4b4327451d54a4228ed08e71509ab8
--- /dev/null
+++ b/UI/Picker/entry/src/main/config.json
@@ -0,0 +1,56 @@
+{
+  "app": {
+    "bundleName": "ohos.samples.picker",
+    "version": {
+      "code": 1000000,
+      "name": "1.0.0"
+    }
+  },
+  "deviceConfig": {},
+  "module": {
+    "package": "ohos.samples.picker",
+    "name": ".MyApplication",
+    "mainAbility": "ohos.samples.picker.MainAbility",
+    "deviceType": [
+      "phone"
+    ],
+    "distro": {
+      "deliveryWithInstall": true,
+      "moduleName": "entry",
+      "moduleType": "entry",
+      "installationFree": false
+    },
+    "abilities": [
+      {
+        "skills": [
+          {
+            "entities": [
+              "entity.system.home"
+            ],
+            "actions": [
+              "action.system.home"
+            ]
+          }
+        ],
+        "name": "ohos.samples.picker.MainAbility",
+        "icon": "$media:icon",
+        "description": "$string:mainability_description",
+        "label": "$string:app_name",
+        "type": "page",
+        "launchType": "standard"
+      }
+    ],
+    "js": [
+      {
+        "pages": [
+          "pages/index/index"
+        ],
+        "name": "default",
+        "window": {
+          "designWidth": 720,
+          "autoDesignWidth": true
+        }
+      }
+    ]
+  }
+}
\ No newline at end of file
diff --git a/UI/Picker/entry/src/main/js/default/app.js b/UI/Picker/entry/src/main/js/default/app.js
new file mode 100644
index 0000000000000000000000000000000000000000..8e47afff13e928a74fdcc01a108e4422404b9ac9
--- /dev/null
+++ b/UI/Picker/entry/src/main/js/default/app.js
@@ -0,0 +1,23 @@
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export default {
+    onCreate() {
+        console.info('AceApplication onCreate');
+    },
+    onDestroy() {
+        console.info('AceApplication onDestroy');
+    }
+};
diff --git a/UI/Picker/entry/src/main/js/default/i18n/en-US.json b/UI/Picker/entry/src/main/js/default/i18n/en-US.json
new file mode 100644
index 0000000000000000000000000000000000000000..94f0ff81f8ca90ecdc354ba293a1126cf6671c00
--- /dev/null
+++ b/UI/Picker/entry/src/main/js/default/i18n/en-US.json
@@ -0,0 +1,9 @@
+{
+  "strings": {
+    "picker-text": "Text :",
+    "date-text": "Date :",
+    "time-text": "Time :",
+    "datetime-text": "DateTime :",
+    "multi-text": "TextMore :"
+  }
+}
\ No newline at end of file
diff --git a/UI/Picker/entry/src/main/js/default/i18n/zh-CN.json b/UI/Picker/entry/src/main/js/default/i18n/zh-CN.json
new file mode 100644
index 0000000000000000000000000000000000000000..00f43a46b5770d28b90550f7410d58214476c2f0
--- /dev/null
+++ b/UI/Picker/entry/src/main/js/default/i18n/zh-CN.json
@@ -0,0 +1,9 @@
+{
+  "strings": {
+    "picker-text": "文本 :",
+    "date-text": "日期 :",
+    "time-text": "时间 :",
+    "datetime-text": "日期时间 :",
+    "multi-text": "多文本 :"
+  }
+}
\ No newline at end of file
diff --git a/UI/Picker/entry/src/main/js/default/pages/index/index.css b/UI/Picker/entry/src/main/js/default/pages/index/index.css
new file mode 100644
index 0000000000000000000000000000000000000000..a0c56aee870fe6ab5850a5dbf903a84653f093cc
--- /dev/null
+++ b/UI/Picker/entry/src/main/js/default/pages/index/index.css
@@ -0,0 +1,42 @@
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+.container {
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+
+.picker {
+    width: 200px;
+    height: 30px;
+    font-size: 16px;
+    margin-left: 20px;
+    text-align: center;
+    border: 1px, solid, black;
+}
+
+.text {
+    width: 30%;
+    font-size: 16px;
+    text-align: center;
+
+}
+
+.picker-text {
+    width: 100%;
+    height: 50px;
+    align-items: center;
+}
diff --git a/UI/Picker/entry/src/main/js/default/pages/index/index.hml b/UI/Picker/entry/src/main/js/default/pages/index/index.hml
new file mode 100644
index 0000000000000000000000000000000000000000..7c3a7977397773a7e3ee70ad9cbdce7457c34cf9
--- /dev/null
+++ b/UI/Picker/entry/src/main/js/default/pages/index/index.hml
@@ -0,0 +1,41 @@
+<!--
+ Copyright (c) 2021 Huawei Device Co., Ltd.
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+     http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ -->
+
+<div class="container">
+    <div class="picker-text">
+        <text class="text">{{ $t('strings.picker-text') }}</text>
+        <picker class="picker" type="text" range="{{ data }}" on:change="textChange">{{ dataText }}</picker>
+    </div>
+    <div class="picker-text">
+        <text class="text">{{ $t('strings.date-text') }}</text>
+        <picker class="picker" type="date" start="1997-10-21" end="2100-12-31" value="2021-7-26"
+                on:change="dateChange">{{ dataDate }}</picker>
+    </div>
+    <div class="picker-text">
+        <text class="text">{{ $t('strings.time-text') }}</text>
+        <picker class="picker" type="time" containsecond="true" value="00:00:00" hours="24" on:change="timeChange">{{
+            dataTime }}</picker>
+    </div>
+    <div class="picker-text">
+        <text class="text">{{ $t('strings.datetime-text') }}</text>
+        <picker class="picker" type="datetime" hours="24" on:change="dateTimeChange">{{ dataDateTime }}
+        </picker>
+    </div>
+    <div class="picker-text">
+        <text class="text">{{ $t('strings.multi-text') }}</text>
+        <picker class="picker" type="multi-text" columns="3" range="{{ multiText }}"
+                on:change="multiTextChange">{{ pickerMulti }}</picker>
+    </div>
+</div>
diff --git a/UI/Picker/entry/src/main/js/default/pages/index/index.js b/UI/Picker/entry/src/main/js/default/pages/index/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..1eaf745d6fec5082389a6bbed139721443fe2eef
--- /dev/null
+++ b/UI/Picker/entry/src/main/js/default/pages/index/index.js
@@ -0,0 +1,46 @@
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export default {
+    data: {
+        data: ["15", "20", "25"],
+        multiText: [["A", "B", "C", "D"], ["a", "b", "c", "d"], ["1", "2", "3", "4"]],
+        dataText: "15",
+        dataDate: "2021-8-2",
+        dataTime: "24:00:00",
+        dataDateTime: "2021-8-2-12-00",
+        pickerMulti: "Ab1"
+    },
+    textChange(e) {
+        this.dataText = e.newValue
+    },
+    dateChange(e) {
+        this.dataDate = e.year + "-" + e.month + "-" + e.day
+    },
+    timeChange(e) {
+        this.dataTime = e.hour + ":" + e.minute + ":" + e.second
+    },
+    dateTimeChange(e) {
+        this.dataDateTime = e.year + "-" + e.month + "-" + e.day + "-" + e.hour + "-" + e.minute
+    },
+    multiTextChange(e) {
+        var sum = " "
+        e.newValue.forEach(function (value, index, array) {
+            array[index] == value
+            sum += value
+        });
+        this.pickerMulti = sum
+    }
+}
diff --git a/UI/Picker/entry/src/main/resources/base/element/string.json b/UI/Picker/entry/src/main/resources/base/element/string.json
new file mode 100644
index 0000000000000000000000000000000000000000..230e06ebbc600b40418db0f2a89e984e46fc9f2f
--- /dev/null
+++ b/UI/Picker/entry/src/main/resources/base/element/string.json
@@ -0,0 +1,12 @@
+{
+  "string": [
+    {
+      "name": "app_name",
+      "value": "Picker"
+    },
+    {
+      "name": "mainability_description",
+      "value": "JS_Empty Ability"
+    }
+  ]
+}
\ No newline at end of file
diff --git a/UI/Picker/entry/src/main/resources/base/media/icon.png b/UI/Picker/entry/src/main/resources/base/media/icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..ce307a8827bd75456441ceb57d530e4c8d45d36c
Binary files /dev/null and b/UI/Picker/entry/src/main/resources/base/media/icon.png differ
diff --git a/UI/Picker/entry/src/main/resources/en/element/string.json b/UI/Picker/entry/src/main/resources/en/element/string.json
new file mode 100644
index 0000000000000000000000000000000000000000..230e06ebbc600b40418db0f2a89e984e46fc9f2f
--- /dev/null
+++ b/UI/Picker/entry/src/main/resources/en/element/string.json
@@ -0,0 +1,12 @@
+{
+  "string": [
+    {
+      "name": "app_name",
+      "value": "Picker"
+    },
+    {
+      "name": "mainability_description",
+      "value": "JS_Empty Ability"
+    }
+  ]
+}
\ No newline at end of file
diff --git a/UI/Picker/entry/src/main/resources/zh/element/string.json b/UI/Picker/entry/src/main/resources/zh/element/string.json
new file mode 100644
index 0000000000000000000000000000000000000000..52c49da29ef18fe591166afe526a7ee311c81e0d
--- /dev/null
+++ b/UI/Picker/entry/src/main/resources/zh/element/string.json
@@ -0,0 +1,12 @@
+{
+  "string": [
+    {
+      "name": "app_name",
+      "value": "滑动选择器"
+    },
+    {
+      "name": "mainability_description",
+      "value": "JS_Empty Ability"
+    }
+  ]
+}
\ No newline at end of file
diff --git a/UI/Picker/screenshots/device/picker.jpg b/UI/Picker/screenshots/device/picker.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..008b0e97877228aceb8aa592d1009734e388a1c1
Binary files /dev/null and b/UI/Picker/screenshots/device/picker.jpg differ
diff --git a/UI/Picker/screenshots/device/pickerDate.jpg b/UI/Picker/screenshots/device/pickerDate.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..29c73a0e43e71b7610b6b64c526f27c22f7f6bd0
Binary files /dev/null and b/UI/Picker/screenshots/device/pickerDate.jpg differ
diff --git a/UI/Picker/screenshots/device/pickerDateTime.jpg b/UI/Picker/screenshots/device/pickerDateTime.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..8703a40f144af369a47cbc4204a0c87a6b951bbb
Binary files /dev/null and b/UI/Picker/screenshots/device/pickerDateTime.jpg differ
diff --git a/UI/Picker/screenshots/device/pickerMulti.jpg b/UI/Picker/screenshots/device/pickerMulti.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..eafa1fee0e666436c2e4af0fd8f055bc6bf6e1d2
Binary files /dev/null and b/UI/Picker/screenshots/device/pickerMulti.jpg differ
diff --git a/UI/Picker/screenshots/device/pickerText.jpg b/UI/Picker/screenshots/device/pickerText.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..038db3e633035280fda8615d82bb5cc25ba63006
Binary files /dev/null and b/UI/Picker/screenshots/device/pickerText.jpg differ
diff --git a/UI/Picker/screenshots/device/pickerTime.jpg b/UI/Picker/screenshots/device/pickerTime.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..4ef626f02e6dbf92f34ec89dea02597693acc6af
Binary files /dev/null and b/UI/Picker/screenshots/device/pickerTime.jpg differ
diff --git a/UI/Picker/settings.gradle b/UI/Picker/settings.gradle
new file mode 100644
index 0000000000000000000000000000000000000000..4773db73233a570c2d0c01a22e75321acfbf7a07
--- /dev/null
+++ b/UI/Picker/settings.gradle
@@ -0,0 +1 @@
+include ':entry'