diff --git a/example/T_CheckBox.qml b/example/T_CheckBox.qml
new file mode 100644
index 00000000..37c1f830
--- /dev/null
+++ b/example/T_CheckBox.qml
@@ -0,0 +1,19 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+
+FluScrollablePage{
+
+    title:"CheckBox"
+    leftPadding:10
+    rightPadding:10
+    bottomPadding:20
+
+    FluCheckBox{
+        Layout.topMargin: 20
+        Layout.leftMargin: 10
+        Layout.bottomMargin: 20
+    }
+}
diff --git a/example/T_Home.qml b/example/T_Home.qml
index cddd110f..f18b0bf4 100644
--- a/example/T_Home.qml
+++ b/example/T_Home.qml
@@ -16,7 +16,8 @@ FluScrollablePage{
         ListElement{
             icon:"qrc:/res/image/ic_home_github.png"
             title:"FluentUI GitHub"
-            desc:"The latest Windows nativecontrols and styles for your applications."
+            desc:"The latest FluentUI controls and styles for your applications."
+            url:"https://github.com/zhuzichu520/FluentUI"
         }
 
     }
@@ -33,8 +34,8 @@ FluScrollablePage{
         Rectangle{
             anchors.fill: parent
             gradient: Gradient{
-                GradientStop { position: 0.8; color: FluTheme.isDark ? Qt.rgba(0,0,0,0) : Qt.rgba(1,1,1,0) }
-                GradientStop { position: 1.0; color: FluTheme.isDark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1) }
+                GradientStop { position: 0.8; color: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(1,1,1,0) }
+                GradientStop { position: 1.0; color: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1) }
             }
         }
         FluText{
@@ -43,7 +44,7 @@ FluScrollablePage{
             anchors{
                 top: parent.top
                 left: parent.left
-                topMargin: 60
+                topMargin: 20
                 leftMargin: 20
             }
         }
@@ -56,7 +57,7 @@ FluScrollablePage{
             }
             orientation: ListView.Horizontal
             boundsBehavior: ListView.StopAtBounds
-            height: 200
+            height: 240
             model: model_header
             header: Item{height: 10;width: 10}
             footer: Item{height: 10;width: 10}
@@ -65,18 +66,64 @@ FluScrollablePage{
             }
             clip: false
             delegate:Item{
-                width: 180
-                height: 200
+                width: 220
+                height: 240
                 FluArea{
                     radius: 8
-                    width: 160
-                    height: 180
+                    width: 200
+                    height: 220
                     anchors.centerIn: parent
-                    color:{
-                        if(item_mouse.containsMouse){
-                            return FluTheme.dark ? Qt.lighter(Qt.rgba(0,0,0,1),1.05)  : Qt.darker(Qt.rgba(1,1,1,1),1.05)
+                    Rectangle{
+                        anchors.fill: parent
+                        radius: 8
+                        color:{
+                            if(FluTheme.dark){
+                                if(item_mouse.containsMouse){
+                                    return Qt.rgba(1,1,1,0.03)
+                                }
+                                return Qt.rgba(0,0,0,0)
+                            }else{
+                                if(item_mouse.containsMouse){
+                                    return Qt.rgba(0,0,0,0.03)
+                                }
+                                return Qt.rgba(0,0,0,0)
+                            }
+                        }
+                    }
+
+                    ColumnLayout{
+                        Image {
+                            Layout.topMargin: 20
+                            Layout.leftMargin: 20
+                            Layout.preferredWidth: 50
+                            Layout.preferredHeight: 50
+                            source: model.icon
+                        }
+                        FluText{
+                            text: model.title
+                            fontStyle: FluText.BodyLarge
+                            Layout.topMargin: 20
+                            Layout.leftMargin: 20
+                        }
+                        FluText{
+                            text: model.desc
+                            Layout.topMargin: 5
+                            Layout.preferredWidth: 160
+                            Layout.leftMargin: 20
+                            color: FluColors.Grey100
+                            font.pixelSize: 12
+                            wrapMode: Text.WrapAnywhere
+                        }
+                    }
+                    FluIcon{
+                        iconSource: FluentIcons.OpenInNewWindow
+                        iconSize: 15
+                        anchors{
+                            bottom: parent.bottom
+                            right: parent.right
+                            rightMargin: 10
+                            bottomMargin: 10
                         }
-                        return FluTheme.dark ? Qt.rgba(0,0,0,0.98)  : Qt.rgba(1,1,1,0.98)
                     }
                     MouseArea{
                         id:item_mouse
@@ -86,13 +133,163 @@ FluScrollablePage{
                             if (wheel.angleDelta.y > 0) scrollbar_header.decrease()
                             else scrollbar_header.increase()
                         }
+                        onClicked: {
+                            Qt.openUrlExternally(model.url)
+                        }
                     }
                 }
             }
         }
-
-
     }
 
+    ListModel{
+        id:model_added
+        ListElement{
+            title:"TabView"
+            icon:"qrc:/res/image/control/TabView.png"
+            desc:"A control that displays a collection of tabs thatcan be used to display several documents."
+        }
+        ListElement{
+            title:"MediaPlayer"
+            icon:"qrc:/res/image/control/MediaPlayerElement.png"
+            desc:"A control to display video and image content"
+        }
+    }
+
+    ListModel{
+        id:model_update
+        ListElement{
+            title:"Buttons"
+            icon:"qrc:/res/image/control/Button.png"
+             desc:"A control that responds to user input and raisesa Click event."
+        }
+        ListElement{
+            title:"InfoBar"
+            icon:"qrc:/res/image/control/InfoBar.png"
+             desc:"An inline message to display app-wide statuschange information."
+        }
+        ListElement{
+            title:"Slider"
+            icon:"qrc:/res/image/control/Slider.png"
+             desc:"A control that lets the user select from a rangeof values by moving a Thumb control along atrack."
+        }
+        ListElement{
+            title:"CheckBox"
+            icon:"qrc:/res/image/control/Checkbox.png"
+             desc:"A control that a user can select or clear."
+        }
+    }
+
+    Component{
+        id:com_item
+        Item{
+            width: 320
+            height: 120
+            FluArea{
+                radius: 8
+                width: 300
+                height: 100
+                anchors.centerIn: parent
+                Rectangle{
+                    anchors.fill: parent
+                    radius: 8
+                    color:{
+                        if(FluTheme.dark){
+                            if(item_mouse.containsMouse){
+                                return Qt.rgba(1,1,1,0.03)
+                            }
+                            return Qt.rgba(0,0,0,0)
+                        }else{
+                            if(item_mouse.containsMouse){
+                                return Qt.rgba(0,0,0,0.03)
+                            }
+                            return Qt.rgba(0,0,0,0)
+                        }
+                    }
+                }
+                Image{
+                    id:item_icon
+                    height: 40
+                    width: 40
+                    source: model.icon
+                    anchors{
+                        left: parent.left
+                        leftMargin: 20
+                        verticalCenter: parent.verticalCenter
+                    }
+                }
+
+                FluText{
+                    id:item_title
+                    text:model.title
+                    fontStyle: FluText.Subtitle
+                    anchors{
+                        left: item_icon.right
+                        leftMargin: 20
+                        top: item_icon.top
+                    }
+                }
+
+                FluText{
+                    id:item_desc
+                    text:model.desc
+                    color:FluColors.Grey100
+                    wrapMode: Text.WrapAnywhere
+                    elide: Text.ElideRight
+                    maximumLineCount: 2
+                    anchors{
+                        left: item_title.left
+                        right: parent.right
+                        rightMargin: 20
+                        top: item_title.bottom
+                        topMargin: 5
+                    }
+                }
+
+                MouseArea{
+                    id:item_mouse
+                    anchors.fill: parent
+                    hoverEnabled: true
+                    onClicked: {
+                        rootwindow.startPageByTitle(model.title)
+                    }
+                }
+            }
+        }
+    }
+
+    FluText{
+        text: "Recently added samples"
+        fontStyle: FluText.TitleLarge
+        Layout.topMargin: 20
+        Layout.leftMargin: 20
+    }
+
+    GridView{
+        Layout.fillWidth: true
+        implicitHeight: contentHeight
+        cellHeight: 120
+        cellWidth: 320
+        boundsBehavior: GridView.StopAtBounds
+        model:model_added
+        delegate: com_item
+    }
+
+    FluText{
+        text: "Recently updated samples"
+        fontStyle: FluText.TitleLarge
+        Layout.topMargin: 20
+        Layout.leftMargin: 20
+    }
+
+    GridView{
+        Layout.fillWidth: true
+        implicitHeight: contentHeight
+        cellHeight: 120
+        cellWidth: 320
+        boundsBehavior: GridView.StopAtBounds
+        model: model_update
+        delegate: com_item
+    }
 
 }
diff --git a/example/T_Slider.qml b/example/T_Slider.qml
index 2b593f77..642dc295 100644
--- a/example/T_Slider.qml
+++ b/example/T_Slider.qml
@@ -2,7 +2,6 @@
 import QtQuick.Layouts 1.15
 import QtQuick.Window 2.15
 import QtQuick.Controls 2.15
-import QtGraphicalEffects 1.15
 import FluentUI 1.0
 
 FluScrollablePage{
diff --git a/example/page/MainPage.qml b/example/page/MainPage.qml
index 308423b9..17858406 100644
--- a/example/page/MainPage.qml
+++ b/example/page/MainPage.qml
@@ -49,6 +49,13 @@ FluWindow {
             }
         }
 
+        FluPaneItem{
+            title:"CheckBox"
+            onTap:{
+                nav_view.push("qrc:/T_CheckBox.qml")
+            }
+        }
+
         FluPaneItem{
             title:"ToggleSwitch"
             onTap:{
@@ -259,5 +266,9 @@ FluWindow {
         }
     }
 
+    function startPageByTitle(title){
+        console.debug(title)
+        nav_view.startPageByTitle(title)
+    }
 
 }
diff --git a/example/qml.qrc b/example/qml.qrc
index 0b4baa3e..5ed5cead 100644
--- a/example/qml.qrc
+++ b/example/qml.qrc
@@ -50,5 +50,104 @@
         <file>T_Home.qml</file>
         <file>res/image/bg_home_header.png</file>
         <file>res/image/ic_home_github.png</file>
+        <file>res/image/control/Acrylic.png</file>
+        <file>res/image/control/AnimatedIcon.png</file>
+        <file>res/image/control/AnimatedVisualPlayer.png</file>
+        <file>res/image/control/AnimationInterop.png</file>
+        <file>res/image/control/AppBarButton.png</file>
+        <file>res/image/control/AppBarSeparator.png</file>
+        <file>res/image/control/AppBarToggleButton.png</file>
+        <file>res/image/control/AutomationProperties.png</file>
+        <file>res/image/control/AutoSuggestBox.png</file>
+        <file>res/image/control/Border.png</file>
+        <file>res/image/control/BreadcrumbBar.png</file>
+        <file>res/image/control/Button.png</file>
+        <file>res/image/control/CalendarDatePicker.png</file>
+        <file>res/image/control/CalendarView.png</file>
+        <file>res/image/control/Canvas.png</file>
+        <file>res/image/control/Checkbox.png</file>
+        <file>res/image/control/Clipboard.png</file>
+        <file>res/image/control/ColorPaletteResources.png</file>
+        <file>res/image/control/ColorPicker.png</file>
+        <file>res/image/control/ComboBox.png</file>
+        <file>res/image/control/CommandBar.png</file>
+        <file>res/image/control/CommandBarFlyout.png</file>
+        <file>res/image/control/CompactSizing.png</file>
+        <file>res/image/control/ConnectedAnimation.png</file>
+        <file>res/image/control/ContentDialog.png</file>
+        <file>res/image/control/CreateMultipleWindows.png</file>
+        <file>res/image/control/DataGrid.png</file>
+        <file>res/image/control/DatePicker.png</file>
+        <file>res/image/control/DropDownButton.png</file>
+        <file>res/image/control/EasingFunction.png</file>
+        <file>res/image/control/Expander.png</file>
+        <file>res/image/control/FilePicker.png</file>
+        <file>res/image/control/FlipView.png</file>
+        <file>res/image/control/Flyout.png</file>
+        <file>res/image/control/Grid.png</file>
+        <file>res/image/control/GridView.png</file>
+        <file>res/image/control/HyperlinkButton.png</file>
+        <file>res/image/control/IconElement.png</file>
+        <file>res/image/control/Image.png</file>
+        <file>res/image/control/ImplicitTransition.png</file>
+        <file>res/image/control/InfoBadge.png</file>
+        <file>res/image/control/InfoBar.png</file>
+        <file>res/image/control/InkCanvas.png</file>
+        <file>res/image/control/InkToolbar.png</file>
+        <file>res/image/control/InputValidation.png</file>
+        <file>res/image/control/ItemsRepeater.png</file>
+        <file>res/image/control/Line.png</file>
+        <file>res/image/control/ListBox.png</file>
+        <file>res/image/control/ListView.png</file>
+        <file>res/image/control/MediaPlayerElement.png</file>
+        <file>res/image/control/MenuBar.png</file>
+        <file>res/image/control/MenuFlyout.png</file>
+        <file>res/image/control/NavigationView.png</file>
+        <file>res/image/control/NumberBox.png</file>
+        <file>res/image/control/PageTransition.png</file>
+        <file>res/image/control/ParallaxView.png</file>
+        <file>res/image/control/PasswordBox.png</file>
+        <file>res/image/control/PersonPicture.png</file>
+        <file>res/image/control/PipsPager.png</file>
+        <file>res/image/control/Pivot.png</file>
+        <file>res/image/control/ProgressBar.png</file>
+        <file>res/image/control/ProgressRing.png</file>
+        <file>res/image/control/PullToRefresh.png</file>
+        <file>res/image/control/RadialGradientBrush.png</file>
+        <file>res/image/control/RadioButton.png</file>
+        <file>res/image/control/RadioButtons.png</file>
+        <file>res/image/control/RatingControl.png</file>
+        <file>res/image/control/RelativePanel.png</file>
+        <file>res/image/control/RepeatButton.png</file>
+        <file>res/image/control/RevealFocus.png</file>
+        <file>res/image/control/RichEditBox.png</file>
+        <file>res/image/control/RichTextBlock.png</file>
+        <file>res/image/control/ScrollViewer.png</file>
+        <file>res/image/control/SemanticZoom.png</file>
+        <file>res/image/control/Shape.png</file>
+        <file>res/image/control/Slider.png</file>
+        <file>res/image/control/Sound.png</file>
+        <file>res/image/control/SplitButton.png</file>
+        <file>res/image/control/SplitView.png</file>
+        <file>res/image/control/StackPanel.png</file>
+        <file>res/image/control/StandardUICommand.png</file>
+        <file>res/image/control/SwipeControl.png</file>
+        <file>res/image/control/TabView.png</file>
+        <file>res/image/control/TeachingTip.png</file>
+        <file>res/image/control/TextBlock.png</file>
+        <file>res/image/control/TextBox.png</file>
+        <file>res/image/control/ThemeTransition.png</file>
+        <file>res/image/control/TimePicker.png</file>
+        <file>res/image/control/TitleBar.png</file>
+        <file>res/image/control/ToggleButton.png</file>
+        <file>res/image/control/ToggleSplitButton.png</file>
+        <file>res/image/control/ToggleSwitch.png</file>
+        <file>res/image/control/ToolTip.png</file>
+        <file>res/image/control/TreeView.png</file>
+        <file>res/image/control/VariableSizedWrapGrid.png</file>
+        <file>res/image/control/Viewbox.png</file>
+        <file>res/image/control/WebView.png</file>
+        <file>res/image/control/XamlUICommand.png</file>
+        <file>T_CheckBox.qml</file>
     </qresource>
 </RCC>
diff --git a/example/res/image/control/Acrylic.png b/example/res/image/control/Acrylic.png
new file mode 100644
index 00000000..73c13283
Binary files /dev/null and b/example/res/image/control/Acrylic.png differ
diff --git a/example/res/image/control/AnimatedIcon.png b/example/res/image/control/AnimatedIcon.png
new file mode 100644
index 00000000..9311db4a
Binary files /dev/null and b/example/res/image/control/AnimatedIcon.png differ
diff --git a/example/res/image/control/AnimatedVisualPlayer.png b/example/res/image/control/AnimatedVisualPlayer.png
new file mode 100644
index 00000000..80356604
Binary files /dev/null and b/example/res/image/control/AnimatedVisualPlayer.png differ
diff --git a/example/res/image/control/AnimationInterop.png b/example/res/image/control/AnimationInterop.png
new file mode 100644
index 00000000..6b385c57
Binary files /dev/null and b/example/res/image/control/AnimationInterop.png differ
diff --git a/example/res/image/control/AppBarButton.png b/example/res/image/control/AppBarButton.png
new file mode 100644
index 00000000..1bd23eb9
Binary files /dev/null and b/example/res/image/control/AppBarButton.png differ
diff --git a/example/res/image/control/AppBarSeparator.png b/example/res/image/control/AppBarSeparator.png
new file mode 100644
index 00000000..b14b397a
Binary files /dev/null and b/example/res/image/control/AppBarSeparator.png differ
diff --git a/example/res/image/control/AppBarToggleButton.png b/example/res/image/control/AppBarToggleButton.png
new file mode 100644
index 00000000..8eaaf8de
Binary files /dev/null and b/example/res/image/control/AppBarToggleButton.png differ
diff --git a/example/res/image/control/AutoSuggestBox.png b/example/res/image/control/AutoSuggestBox.png
new file mode 100644
index 00000000..5403ced8
Binary files /dev/null and b/example/res/image/control/AutoSuggestBox.png differ
diff --git a/example/res/image/control/AutomationProperties.png b/example/res/image/control/AutomationProperties.png
new file mode 100644
index 00000000..7a44af31
Binary files /dev/null and b/example/res/image/control/AutomationProperties.png differ
diff --git a/example/res/image/control/Border.png b/example/res/image/control/Border.png
new file mode 100644
index 00000000..02717a90
Binary files /dev/null and b/example/res/image/control/Border.png differ
diff --git a/example/res/image/control/BreadcrumbBar.png b/example/res/image/control/BreadcrumbBar.png
new file mode 100644
index 00000000..38629c30
Binary files /dev/null and b/example/res/image/control/BreadcrumbBar.png differ
diff --git a/example/res/image/control/Button.png b/example/res/image/control/Button.png
new file mode 100644
index 00000000..74088138
Binary files /dev/null and b/example/res/image/control/Button.png differ
diff --git a/example/res/image/control/CalendarDatePicker.png b/example/res/image/control/CalendarDatePicker.png
new file mode 100644
index 00000000..b3f5f9af
Binary files /dev/null and b/example/res/image/control/CalendarDatePicker.png differ
diff --git a/example/res/image/control/CalendarView.png b/example/res/image/control/CalendarView.png
new file mode 100644
index 00000000..fe34b826
Binary files /dev/null and b/example/res/image/control/CalendarView.png differ
diff --git a/example/res/image/control/Canvas.png b/example/res/image/control/Canvas.png
new file mode 100644
index 00000000..9c857db5
Binary files /dev/null and b/example/res/image/control/Canvas.png differ
diff --git a/example/res/image/control/Checkbox.png b/example/res/image/control/Checkbox.png
new file mode 100644
index 00000000..6616d873
Binary files /dev/null and b/example/res/image/control/Checkbox.png differ
diff --git a/example/res/image/control/Clipboard.png b/example/res/image/control/Clipboard.png
new file mode 100644
index 00000000..0e24c270
Binary files /dev/null and b/example/res/image/control/Clipboard.png differ
diff --git a/example/res/image/control/ColorPaletteResources.png b/example/res/image/control/ColorPaletteResources.png
new file mode 100644
index 00000000..8f4e31cb
Binary files /dev/null and b/example/res/image/control/ColorPaletteResources.png differ
diff --git a/example/res/image/control/ColorPicker.png b/example/res/image/control/ColorPicker.png
new file mode 100644
index 00000000..b4e7a96b
Binary files /dev/null and b/example/res/image/control/ColorPicker.png differ
diff --git a/example/res/image/control/ComboBox.png b/example/res/image/control/ComboBox.png
new file mode 100644
index 00000000..dee1fd9a
Binary files /dev/null and b/example/res/image/control/ComboBox.png differ
diff --git a/example/res/image/control/CommandBar.png b/example/res/image/control/CommandBar.png
new file mode 100644
index 00000000..e2656666
Binary files /dev/null and b/example/res/image/control/CommandBar.png differ
diff --git a/example/res/image/control/CommandBarFlyout.png b/example/res/image/control/CommandBarFlyout.png
new file mode 100644
index 00000000..415c4293
Binary files /dev/null and b/example/res/image/control/CommandBarFlyout.png differ
diff --git a/example/res/image/control/CompactSizing.png b/example/res/image/control/CompactSizing.png
new file mode 100644
index 00000000..4ae95db3
Binary files /dev/null and b/example/res/image/control/CompactSizing.png differ
diff --git a/example/res/image/control/ConnectedAnimation.png b/example/res/image/control/ConnectedAnimation.png
new file mode 100644
index 00000000..ff4e1595
Binary files /dev/null and b/example/res/image/control/ConnectedAnimation.png differ
diff --git a/example/res/image/control/ContentDialog.png b/example/res/image/control/ContentDialog.png
new file mode 100644
index 00000000..0ade66e1
Binary files /dev/null and b/example/res/image/control/ContentDialog.png differ
diff --git a/example/res/image/control/CreateMultipleWindows.png b/example/res/image/control/CreateMultipleWindows.png
new file mode 100644
index 00000000..d70a55ca
Binary files /dev/null and b/example/res/image/control/CreateMultipleWindows.png differ
diff --git a/example/res/image/control/DataGrid.png b/example/res/image/control/DataGrid.png
new file mode 100644
index 00000000..3b105a3e
Binary files /dev/null and b/example/res/image/control/DataGrid.png differ
diff --git a/example/res/image/control/DatePicker.png b/example/res/image/control/DatePicker.png
new file mode 100644
index 00000000..23d35b3e
Binary files /dev/null and b/example/res/image/control/DatePicker.png differ
diff --git a/example/res/image/control/DropDownButton.png b/example/res/image/control/DropDownButton.png
new file mode 100644
index 00000000..dc5ff6d9
Binary files /dev/null and b/example/res/image/control/DropDownButton.png differ
diff --git a/example/res/image/control/EasingFunction.png b/example/res/image/control/EasingFunction.png
new file mode 100644
index 00000000..caeee149
Binary files /dev/null and b/example/res/image/control/EasingFunction.png differ
diff --git a/example/res/image/control/Expander.png b/example/res/image/control/Expander.png
new file mode 100644
index 00000000..531a7f4e
Binary files /dev/null and b/example/res/image/control/Expander.png differ
diff --git a/example/res/image/control/FilePicker.png b/example/res/image/control/FilePicker.png
new file mode 100644
index 00000000..7bcbbc14
Binary files /dev/null and b/example/res/image/control/FilePicker.png differ
diff --git a/example/res/image/control/FlipView.png b/example/res/image/control/FlipView.png
new file mode 100644
index 00000000..ee466c0a
Binary files /dev/null and b/example/res/image/control/FlipView.png differ
diff --git a/example/res/image/control/Flyout.png b/example/res/image/control/Flyout.png
new file mode 100644
index 00000000..28fd0329
Binary files /dev/null and b/example/res/image/control/Flyout.png differ
diff --git a/example/res/image/control/Grid.png b/example/res/image/control/Grid.png
new file mode 100644
index 00000000..6019cee4
Binary files /dev/null and b/example/res/image/control/Grid.png differ
diff --git a/example/res/image/control/GridView.png b/example/res/image/control/GridView.png
new file mode 100644
index 00000000..3829acbf
Binary files /dev/null and b/example/res/image/control/GridView.png differ
diff --git a/example/res/image/control/HyperlinkButton.png b/example/res/image/control/HyperlinkButton.png
new file mode 100644
index 00000000..51549ecc
Binary files /dev/null and b/example/res/image/control/HyperlinkButton.png differ
diff --git a/example/res/image/control/IconElement.png b/example/res/image/control/IconElement.png
new file mode 100644
index 00000000..9164bffd
Binary files /dev/null and b/example/res/image/control/IconElement.png differ
diff --git a/example/res/image/control/Image.png b/example/res/image/control/Image.png
new file mode 100644
index 00000000..96df4be1
Binary files /dev/null and b/example/res/image/control/Image.png differ
diff --git a/example/res/image/control/ImplicitTransition.png b/example/res/image/control/ImplicitTransition.png
new file mode 100644
index 00000000..fe595e17
Binary files /dev/null and b/example/res/image/control/ImplicitTransition.png differ
diff --git a/example/res/image/control/InfoBadge.png b/example/res/image/control/InfoBadge.png
new file mode 100644
index 00000000..21263ace
Binary files /dev/null and b/example/res/image/control/InfoBadge.png differ
diff --git a/example/res/image/control/InfoBar.png b/example/res/image/control/InfoBar.png
new file mode 100644
index 00000000..3d9f9d7f
Binary files /dev/null and b/example/res/image/control/InfoBar.png differ
diff --git a/example/res/image/control/InkCanvas.png b/example/res/image/control/InkCanvas.png
new file mode 100644
index 00000000..897b82c9
Binary files /dev/null and b/example/res/image/control/InkCanvas.png differ
diff --git a/example/res/image/control/InkToolbar.png b/example/res/image/control/InkToolbar.png
new file mode 100644
index 00000000..2134e8c7
Binary files /dev/null and b/example/res/image/control/InkToolbar.png differ
diff --git a/example/res/image/control/InputValidation.png b/example/res/image/control/InputValidation.png
new file mode 100644
index 00000000..d090df43
Binary files /dev/null and b/example/res/image/control/InputValidation.png differ
diff --git a/example/res/image/control/ItemsRepeater.png b/example/res/image/control/ItemsRepeater.png
new file mode 100644
index 00000000..18dc1cd1
Binary files /dev/null and b/example/res/image/control/ItemsRepeater.png differ
diff --git a/example/res/image/control/Line.png b/example/res/image/control/Line.png
new file mode 100644
index 00000000..ed3e408f
Binary files /dev/null and b/example/res/image/control/Line.png differ
diff --git a/example/res/image/control/ListBox.png b/example/res/image/control/ListBox.png
new file mode 100644
index 00000000..2d8d1a7f
Binary files /dev/null and b/example/res/image/control/ListBox.png differ
diff --git a/example/res/image/control/ListView.png b/example/res/image/control/ListView.png
new file mode 100644
index 00000000..8fc7cec7
Binary files /dev/null and b/example/res/image/control/ListView.png differ
diff --git a/example/res/image/control/MediaPlayerElement.png b/example/res/image/control/MediaPlayerElement.png
new file mode 100644
index 00000000..b517c7ec
Binary files /dev/null and b/example/res/image/control/MediaPlayerElement.png differ
diff --git a/example/res/image/control/MenuBar.png b/example/res/image/control/MenuBar.png
new file mode 100644
index 00000000..35553ad4
Binary files /dev/null and b/example/res/image/control/MenuBar.png differ
diff --git a/example/res/image/control/MenuFlyout.png b/example/res/image/control/MenuFlyout.png
new file mode 100644
index 00000000..a5019709
Binary files /dev/null and b/example/res/image/control/MenuFlyout.png differ
diff --git a/example/res/image/control/NavigationView.png b/example/res/image/control/NavigationView.png
new file mode 100644
index 00000000..a92e069c
Binary files /dev/null and b/example/res/image/control/NavigationView.png differ
diff --git a/example/res/image/control/NumberBox.png b/example/res/image/control/NumberBox.png
new file mode 100644
index 00000000..674791cb
Binary files /dev/null and b/example/res/image/control/NumberBox.png differ
diff --git a/example/res/image/control/PageTransition.png b/example/res/image/control/PageTransition.png
new file mode 100644
index 00000000..25b18ab1
Binary files /dev/null and b/example/res/image/control/PageTransition.png differ
diff --git a/example/res/image/control/ParallaxView.png b/example/res/image/control/ParallaxView.png
new file mode 100644
index 00000000..07160cf0
Binary files /dev/null and b/example/res/image/control/ParallaxView.png differ
diff --git a/example/res/image/control/PasswordBox.png b/example/res/image/control/PasswordBox.png
new file mode 100644
index 00000000..9b613c79
Binary files /dev/null and b/example/res/image/control/PasswordBox.png differ
diff --git a/example/res/image/control/PersonPicture.png b/example/res/image/control/PersonPicture.png
new file mode 100644
index 00000000..23d2e64d
Binary files /dev/null and b/example/res/image/control/PersonPicture.png differ
diff --git a/example/res/image/control/PipsPager.png b/example/res/image/control/PipsPager.png
new file mode 100644
index 00000000..c07faf14
Binary files /dev/null and b/example/res/image/control/PipsPager.png differ
diff --git a/example/res/image/control/Pivot.png b/example/res/image/control/Pivot.png
new file mode 100644
index 00000000..675ee0ed
Binary files /dev/null and b/example/res/image/control/Pivot.png differ
diff --git a/example/res/image/control/ProgressBar.png b/example/res/image/control/ProgressBar.png
new file mode 100644
index 00000000..9e0e0033
Binary files /dev/null and b/example/res/image/control/ProgressBar.png differ
diff --git a/example/res/image/control/ProgressRing.png b/example/res/image/control/ProgressRing.png
new file mode 100644
index 00000000..fc365f68
Binary files /dev/null and b/example/res/image/control/ProgressRing.png differ
diff --git a/example/res/image/control/PullToRefresh.png b/example/res/image/control/PullToRefresh.png
new file mode 100644
index 00000000..0ea571ae
Binary files /dev/null and b/example/res/image/control/PullToRefresh.png differ
diff --git a/example/res/image/control/RadialGradientBrush.png b/example/res/image/control/RadialGradientBrush.png
new file mode 100644
index 00000000..047ef767
Binary files /dev/null and b/example/res/image/control/RadialGradientBrush.png differ
diff --git a/example/res/image/control/RadioButton.png b/example/res/image/control/RadioButton.png
new file mode 100644
index 00000000..9fdaafa8
Binary files /dev/null and b/example/res/image/control/RadioButton.png differ
diff --git a/example/res/image/control/RadioButtons.png b/example/res/image/control/RadioButtons.png
new file mode 100644
index 00000000..cab12c1a
Binary files /dev/null and b/example/res/image/control/RadioButtons.png differ
diff --git a/example/res/image/control/RatingControl.png b/example/res/image/control/RatingControl.png
new file mode 100644
index 00000000..30efd43c
Binary files /dev/null and b/example/res/image/control/RatingControl.png differ
diff --git a/example/res/image/control/RelativePanel.png b/example/res/image/control/RelativePanel.png
new file mode 100644
index 00000000..df1ae73f
Binary files /dev/null and b/example/res/image/control/RelativePanel.png differ
diff --git a/example/res/image/control/RepeatButton.png b/example/res/image/control/RepeatButton.png
new file mode 100644
index 00000000..eb1ad5b9
Binary files /dev/null and b/example/res/image/control/RepeatButton.png differ
diff --git a/example/res/image/control/RevealFocus.png b/example/res/image/control/RevealFocus.png
new file mode 100644
index 00000000..d9127780
Binary files /dev/null and b/example/res/image/control/RevealFocus.png differ
diff --git a/example/res/image/control/RichEditBox.png b/example/res/image/control/RichEditBox.png
new file mode 100644
index 00000000..3ffe648c
Binary files /dev/null and b/example/res/image/control/RichEditBox.png differ
diff --git a/example/res/image/control/RichTextBlock.png b/example/res/image/control/RichTextBlock.png
new file mode 100644
index 00000000..34cd05e7
Binary files /dev/null and b/example/res/image/control/RichTextBlock.png differ
diff --git a/example/res/image/control/ScrollViewer.png b/example/res/image/control/ScrollViewer.png
new file mode 100644
index 00000000..d54541ae
Binary files /dev/null and b/example/res/image/control/ScrollViewer.png differ
diff --git a/example/res/image/control/SemanticZoom.png b/example/res/image/control/SemanticZoom.png
new file mode 100644
index 00000000..bbdbf45b
Binary files /dev/null and b/example/res/image/control/SemanticZoom.png differ
diff --git a/example/res/image/control/Shape.png b/example/res/image/control/Shape.png
new file mode 100644
index 00000000..c37f49e9
Binary files /dev/null and b/example/res/image/control/Shape.png differ
diff --git a/example/res/image/control/Slider.png b/example/res/image/control/Slider.png
new file mode 100644
index 00000000..cdc61759
Binary files /dev/null and b/example/res/image/control/Slider.png differ
diff --git a/example/res/image/control/Sound.png b/example/res/image/control/Sound.png
new file mode 100644
index 00000000..bcec53a9
Binary files /dev/null and b/example/res/image/control/Sound.png differ
diff --git a/example/res/image/control/SplitButton.png b/example/res/image/control/SplitButton.png
new file mode 100644
index 00000000..1f0e1415
Binary files /dev/null and b/example/res/image/control/SplitButton.png differ
diff --git a/example/res/image/control/SplitView.png b/example/res/image/control/SplitView.png
new file mode 100644
index 00000000..73d81193
Binary files /dev/null and b/example/res/image/control/SplitView.png differ
diff --git a/example/res/image/control/StackPanel.png b/example/res/image/control/StackPanel.png
new file mode 100644
index 00000000..f7e46a01
Binary files /dev/null and b/example/res/image/control/StackPanel.png differ
diff --git a/example/res/image/control/StandardUICommand.png b/example/res/image/control/StandardUICommand.png
new file mode 100644
index 00000000..a22ee815
Binary files /dev/null and b/example/res/image/control/StandardUICommand.png differ
diff --git a/example/res/image/control/SwipeControl.png b/example/res/image/control/SwipeControl.png
new file mode 100644
index 00000000..796eb656
Binary files /dev/null and b/example/res/image/control/SwipeControl.png differ
diff --git a/example/res/image/control/TabView.png b/example/res/image/control/TabView.png
new file mode 100644
index 00000000..0364e3a8
Binary files /dev/null and b/example/res/image/control/TabView.png differ
diff --git a/example/res/image/control/TeachingTip.png b/example/res/image/control/TeachingTip.png
new file mode 100644
index 00000000..2428e2a3
Binary files /dev/null and b/example/res/image/control/TeachingTip.png differ
diff --git a/example/res/image/control/TextBlock.png b/example/res/image/control/TextBlock.png
new file mode 100644
index 00000000..a97c489f
Binary files /dev/null and b/example/res/image/control/TextBlock.png differ
diff --git a/example/res/image/control/TextBox.png b/example/res/image/control/TextBox.png
new file mode 100644
index 00000000..281645b6
Binary files /dev/null and b/example/res/image/control/TextBox.png differ
diff --git a/example/res/image/control/ThemeTransition.png b/example/res/image/control/ThemeTransition.png
new file mode 100644
index 00000000..91a74c05
Binary files /dev/null and b/example/res/image/control/ThemeTransition.png differ
diff --git a/example/res/image/control/TimePicker.png b/example/res/image/control/TimePicker.png
new file mode 100644
index 00000000..c63aca39
Binary files /dev/null and b/example/res/image/control/TimePicker.png differ
diff --git a/example/res/image/control/TitleBar.png b/example/res/image/control/TitleBar.png
new file mode 100644
index 00000000..2c76819c
Binary files /dev/null and b/example/res/image/control/TitleBar.png differ
diff --git a/example/res/image/control/ToggleButton.png b/example/res/image/control/ToggleButton.png
new file mode 100644
index 00000000..52682aa0
Binary files /dev/null and b/example/res/image/control/ToggleButton.png differ
diff --git a/example/res/image/control/ToggleSplitButton.png b/example/res/image/control/ToggleSplitButton.png
new file mode 100644
index 00000000..3582c107
Binary files /dev/null and b/example/res/image/control/ToggleSplitButton.png differ
diff --git a/example/res/image/control/ToggleSwitch.png b/example/res/image/control/ToggleSwitch.png
new file mode 100644
index 00000000..a8537a2a
Binary files /dev/null and b/example/res/image/control/ToggleSwitch.png differ
diff --git a/example/res/image/control/ToolTip.png b/example/res/image/control/ToolTip.png
new file mode 100644
index 00000000..83eee5ac
Binary files /dev/null and b/example/res/image/control/ToolTip.png differ
diff --git a/example/res/image/control/TreeView.png b/example/res/image/control/TreeView.png
new file mode 100644
index 00000000..0a652bac
Binary files /dev/null and b/example/res/image/control/TreeView.png differ
diff --git a/example/res/image/control/VariableSizedWrapGrid.png b/example/res/image/control/VariableSizedWrapGrid.png
new file mode 100644
index 00000000..f2f0c78e
Binary files /dev/null and b/example/res/image/control/VariableSizedWrapGrid.png differ
diff --git a/example/res/image/control/Viewbox.png b/example/res/image/control/Viewbox.png
new file mode 100644
index 00000000..8940cdfc
Binary files /dev/null and b/example/res/image/control/Viewbox.png differ
diff --git a/example/res/image/control/WebView.png b/example/res/image/control/WebView.png
new file mode 100644
index 00000000..c6742a1d
Binary files /dev/null and b/example/res/image/control/WebView.png differ
diff --git a/example/res/image/control/XamlUICommand.png b/example/res/image/control/XamlUICommand.png
new file mode 100644
index 00000000..9c03d5bf
Binary files /dev/null and b/example/res/image/control/XamlUICommand.png differ
diff --git a/src/controls/FluIconButton.qml b/src/controls/FluIconButton.qml
index 7d9b67ca..36eb39a1 100644
--- a/src/controls/FluIconButton.qml
+++ b/src/controls/FluIconButton.qml
@@ -10,7 +10,7 @@ Button {
     property int radius:4
     property color hoverColor: FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(0,0,0,0.03)
     property color normalColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
-    property color disableColor: FluTheme.dark ? Qt.rgba(59/255,59/255,59/255,1) : Qt.rgba(0,0,0,0)
+    property color disableColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
     property color color: {
         if(disabled){
             return disableColor
diff --git a/src/controls/FluNavigationView.qml b/src/controls/FluNavigationView.qml
index 8f5b1349..8e23cad6 100644
--- a/src/controls/FluNavigationView.qml
+++ b/src/controls/FluNavigationView.qml
@@ -420,4 +420,17 @@ Item {
         nav_list.currentIndex = index
     }
 
+    function startPageByTitle(title){
+        for(var i=0;i<items.children.length;i++){
+            if(items.children[i].title === title){
+                if(nav_list.currentIndex === i){
+                    return
+                }
+                items.children[i].tap()
+                nav_list.currentIndex = i
+                return
+            }
+        }
+    }
+
 }