diff --git a/chameleon/CMakeLists.txt b/chameleon/CMakeLists.txt
index dd21061f..9fd3f1af 100644
--- a/chameleon/CMakeLists.txt
+++ b/chameleon/CMakeLists.txt
@@ -35,6 +35,7 @@ set(QML_FILES
     RadioButton.qml
     RoundButton.qml
     ScrollBar.qml
+    ScrollView.qml
     ScrollIndicator.qml
     Slider.qml
     SpinBox.qml
diff --git a/chameleon/ScrollView.qml b/chameleon/ScrollView.qml
new file mode 100644
index 00000000..d7e875e7
--- /dev/null
+++ b/chameleon/ScrollView.qml
@@ -0,0 +1,10 @@
+// SPDX-FileCopyrightText: 2020 - 2022 UnionTech Software Technology Co., Ltd.
+//
+// SPDX-License-Identifier: LGPL-3.0-or-later
+
+import org.deepin.dtk 1.0 as D
+
+D.ScrollView {
+
+}
+
diff --git a/chameleon/qml.qrc b/chameleon/qml.qrc
index c4de3a7b..cec609af 100644
--- a/chameleon/qml.qrc
+++ b/chameleon/qml.qrc
@@ -23,6 +23,7 @@
     <file>RadioButton.qml</file>
     <file>RoundButton.qml</file>
     <file>ScrollBar.qml</file>
+    <file>ScrollView.qml</file>
     <file>ScrollIndicator.qml</file>
     <file>Slider.qml</file>
     <file>SpinBox.qml</file>
diff --git a/examples/exhibition/ViewQMLSource.qml b/examples/exhibition/ViewQMLSource.qml
index 81fc5dc4..e52f3582 100644
--- a/examples/exhibition/ViewQMLSource.qml
+++ b/examples/exhibition/ViewQMLSource.qml
@@ -54,7 +54,7 @@ ColumnLayout {
                         var obj = Qt.createQmlObject(edit.text, codePreview,  url.toString().replace(".qml", "_temporary.qml"))
                         globalObject.replace(lastPreview, obj)
                         lastPreview = obj
-                        obj.width = codePreview.width
+                        obj.width = Qt.binding(function () { return codePreview.width })
                         errorMessage.text = ""
                     } catch (error) {
                         errorMessage.text = String(error.lineNumber ? error.lineNumber : "未知") + "行，"
diff --git a/qmlplugin/qmlplugin_plugin.cpp b/qmlplugin/qmlplugin_plugin.cpp
index 0178de15..dff0ff85 100644
--- a/qmlplugin/qmlplugin_plugin.cpp
+++ b/qmlplugin/qmlplugin_plugin.cpp
@@ -254,6 +254,7 @@ void QmlpluginPlugin::registerTypes(const char *uri)
     dtkRegisterType(uri, controlsUri, 1, 0, "ScrollIndicator");
     dtkRegisterType(uri, controlsUri, 1, 0, "Popup");
     dtkRegisterType(uri, controlsUri, 1, 0, "ScrollBar");
+    dtkRegisterType(uri, controlsUri, 1, 0, "ScrollView");
     // DTK Controls
     dtkRegisterType(uri, controlsUri, 1, 0, "LineEdit");
     dtkRegisterType(uri, controlsUri, 1, 0, "SearchEdit");
diff --git a/qt6/src/qml/ScrollView.qml b/qt6/src/qml/ScrollView.qml
index e341191d..68105994 100644
--- a/qt6/src/qml/ScrollView.qml
+++ b/qt6/src/qml/ScrollView.qml
@@ -2,8 +2,32 @@
 //
 // SPDX-License-Identifier: LGPL-3.0-or-later
 
-import QtQuick.Controls
+import QtQuick
+import QtQuick.Controls.impl
+import QtQuick.Templates as T
+import org.deepin.dtk 1.0 as D
 
-ScrollView {
+T.ScrollView {
+    id: control
 
+    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+                            contentWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+                             contentHeight + topPadding + bottomPadding)
+
+    D.ScrollBar.vertical: D.ScrollBar {
+        parent: control
+        x: control.mirrored ? 0 : control.width - width
+        y: control.topPadding
+        height: control.availableHeight
+        active: control.D.ScrollBar.horizontal.active
+    }
+
+    D.ScrollBar.horizontal: D.ScrollBar {
+        parent: control
+        x: control.leftPadding
+        y: control.height - height
+        width: control.availableWidth
+        active: control.D.ScrollBar.vertical.active
+    }
 }
diff --git a/qt6/src/qml/TextArea.qml b/qt6/src/qml/TextArea.qml
index 4e0d26e9..a2a77f58 100644
--- a/qt6/src/qml/TextArea.qml
+++ b/qt6/src/qml/TextArea.qml
@@ -13,9 +13,13 @@ T.TextArea {
 
     property D.Palette placeholderTextPalette: DS.Style.edit.placeholderText
     placeholderTextColor: D.ColorSelector.placeholderTextPalette
-    implicitWidth: Math.max(DS.Style.control.implicitWidth(control), placeholder.implicitWidth + leftPadding + rightPadding)
-    implicitHeight: Math.max(DS.Style.control.implicitHeight(control), placeholder.implicitHeight + topPadding + bottomPadding)
-
+    implicitWidth: Math.max(contentWidth + leftPadding + rightPadding,
+                            implicitBackgroundWidth + leftInset + rightInset,
+                            placeholder.implicitWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(contentHeight + topPadding + bottomPadding,
+                             implicitBackgroundHeight + topInset + bottomInset,
+                             placeholder.implicitHeight + topPadding + bottomPadding)
+                             
     padding: DS.Style.control.padding
 
     color: palette.text