# Qt Design Studio 控件大全

## 一、BASIC （基础）

#### AnimatedImage

提供一种方式来播放存储包含一系列的帧的图像动画，如存储gif图像文件

#### BorderImage

#### Flickable

将其子项放置在可以拖动和轻弹的表面上，从而使得子项上的视图滚动

#### focusScope

#### Image

#### Item

#### MouseArea

启用简单的鼠标操作

#### Rectangle

使用可选边框绘制填充矩形

#### Text

Text可以显示纯文本和富文本

标签是文本的简单版本。文本是标签加项目。

基本上，如果只想要一个文本并且它可以满足您的需求，请使用标签。

如果需要额外的控制，请使用文本。

Text 拥有 Label 拥有的一切

#### TextEdit

多行文本编辑框，功能与TextInput类似，支持富文本

TextEdit 是 Qt Quick 提供的多行文本编辑框，它的大多数属性与 Textinput 类似，不同之处在于，TextEdit 用来显示多行的可编辑的格式化文本，它既可以显示纯文本也可以显示富文本。如下面的代码所示：

```
 Rectangle {
        width:156
        height: 64
        color: "lightgrey"
        border.color: "grey"
        x: 348
        y: 300
    TextEdit {
        anchors.fill: parent
        id: textEdit
        width: 133
        height: 36
        text: qsTr("Text Edit")
        font.pixelSize: 12
        clip: true
    }
    }
```

#### TextInput

单行文本编辑框，支持复制、粘贴、撤销，不支持富文本

TextInput 除了显示光标和文本外，默认并没有边框等装饰性效果，所以在使用时一般要为其添加一个可视化的外观。 示例代码如下：

```
Rectangle {
        width:100
        height: 24
        color: "lightgrey"
        border.color: "grey"
        x: 348
        y: 141
    TextInput {
        id: textInput

        width: 97
        height: 27
        color: "#f61616"
        text: qsTr("请输入用户名")
        font.pixelSize: 14
        selectedTextColor: "#9f1eaf"
        readOnly: false
        selectionColor: "#0c0cf3"
    }
    }
```

## 二、VIEWS （视图）

#### GridView

#### ListView

#### PathView

## 三、POSITIONER （定位）

#### Column

#### Flow

#### Grid

#### Row

## 四、ANIMATION （动画）

#### ColorAnimation

#### NumberAnimation

#### ParallelAnimation

#### PropertyAction

#### PropertyAnimation

#### ScriptAction

#### SequentialAnimation

## 五、COMPONENT （组件）

#### Component

#### Loader

#### Repeater

## 六、QTQUICK CONTROLS

#### BusyIndicator

#### Button

#### CheckBox

#### CheckDelegate

#### ComboBox

#### DelayButton

#### Dial

#### Frame

#### GroupBox

#### ItemDelegate

#### Label

#### Page

#### PageIndicator

#### Pane

#### ProgressBar

#### RadioButton

#### RadioDelegate

#### RangeSlider

#### RoundButton

#### ScrollView

#### Slider

#### SwitchDelegate

#### TabBar

#### TabButton

#### TextArea

#### TextField

#### ToolBar

#### ToolButton

#### ToolSeparator

#### Tumbler

## 七、QTQUICK LAYOUTS

#### ColumnLayout

#### GridLayout

#### RowLayout

#### StackLayout

## 八、QTQUICK STUDIO COMPONENTS

**【STUDIO COMPONENTS】**

#### Arc

#### Border

#### ellipse

#### Flipable

#### Group

#### Pie

#### Rectangle

#### RegularPolygon

#### SVGPathItem

#### Triangle

**【STUDIO COMPONENTS ARROWS】(箭头)**

#### ArcArrow

#### Down

#### DownLeft

#### DownRight

#### Left

#### LeftDown

#### LeftUp

#### Right

#### RightDown

#### RightUp

#### Up

#### UpLeft

#### UpRight