QML学习之基本元素ProgressBar, TabView, Slider介绍

本文继续介绍基本元素ProgressBar, TabView, Slider。

   E ) ProgressBar

   ProgressBar, 进度条。minimumValue表示最小值:maximumValue表示最大值;value是当前值，更新它进度条

就会变化。orientation代表方向，默认取值Qt.Horizontal，水平方向;要想进度条变垂直，设置其为Qt.Vertical。

   indeterminate属性，默认是false.当不知道实际进度时，设置为true, ProgressBar会变为BusyIndicator，就是会来回跑的进度条。Qt助手上的描述是This property holds whether the progress bar is in indeterminate mode. A progress bar in indeterminate mode displays that an operation is in progress, but it doesn't show how much progress has been made.

style属性指向一个ProgressBarStyle来定制进度条的外观。ProgressBarStyle的control属性指向表示当前进度。currentProgress是一个0到1的值，表示当前进度。background用来绘制进度条的背景，progress用来绘制进度。当有需要在在progress对应的矩形与background的边框之间做一些留白时，我们需要用到panel。源码中，ProgressBarStyle.qml里的panel，负责整个Progress Bar的绘制，它在内部使用Loader调用background和progress这两个Component, background在下，progress在上，并一且根据currentProgress来改变加载progress那个Loader的宽度。因此可以通过重写panel，来实现这个需求。

   F ) TabView

    TabView，标签控件，又被叫做选项卡控件。接下来说一下它的属性和方法。     

    count属性是只读的，返回TabView内的标签页的个数。

    currentIndex属性代表当前标签页的索引，从0开始，可以读取也可以设置它来切换标签。

    frameVisible指示标签页对应的内容周围的边框是否可见。

    tabVisible设置标签栏是可见。

    tabPosition保存标签栏的位置，默认是Qt.TopEdge，在界面顶部;置tabPosition为Qt.BottomEdge，标签栏就会跑到界面底部。

    addTab ( title, component)方法用于增加一个标签，第一个参数是标签的标题，第二个参数是一个组件，代表标签对应的可视控件。insertTab ( index, title, component)在指定索引位置插入一个标签。

    removeTab ( index)删除指定位置的标签。moveTab(from, to)将一个标签从索引from移动到索引to o getTab ( index)返回指定位置的标签对象(类型为Tab ) , Tab对象只有一个title属性，是Loader的派生类。

    TabView的style属性虽然没有列出来，但是TabViewStyle的例子里，使用了。下面我们简要说一下TabViewStyle的组建内容和基本使用。tabBar绘制标签栏的背景。tab绘制一个个的标签。frame绘制TabView的边框。

    tab组件内可以通过styleData访问tab的状态:

    styleData. index，本标签的索引。

    styleData.selected，本标签是否被选中为活动标签。

    styleData.title，本标签的文本。

    styleData.nextSelected，下一个标签被选中了。

    styleData.previousSelected，前一个标签被选中了。

    styleData.hovered, 鼠标是否悬停在本标签上。

    styleData.enabled，本标签是否被使能。

    styleData.activeFocus，本标签是否拥有键盘焦点。

    styleData.availableWidth，标签的可用宽度。

    styleData.totalWidth，标签的总宽度。

     tabsAlignment设置标签的对齐方式，默认为Qt.AlignLeft，还可以取值Qt.AlignHCenter,Qt.AlignRight。

    frameOverlap 指定标签和TabView边框之间可以重叠的宽度。

    tabOverlap指定标签之间可以重叠的宽度。

    tabsMovable设置标签是否可以移动，默认false，不可移动。

   G ) Slider

    Slider类代表一个水平或垂直的滑块控件，通常用于让用户在某个取值范围内选择一个值。

 

    滑块组件分为面板(panel )、滑槽( groove )、刻度线(tickmarks)和滑块(handle)四部分。而Slider对应的用来定制滑块控件外观的SliderStyle类，恰恰就有groove, handle,panel, tickmarks四个组件。也就是说，滑块控件的每个组成部分，都可以定制。不过，我们一般只定制handle和groove，其他两个定制起来稍微麻烦一些。

    maximumValue用来设置最大值，默认值为1.0。minimumValue用来设置最小值，默认值为0。value代表滑块控件的当前值，默认值为0，使用onValueChanged信号处理器可以跟踪滑块当前值的变化。

    stepSize用来设置滑块变化的步长，当你使用方向键调整滑块时，按一次它就增加或减少stepSize设定的值。

    orientation属性用来设置控件的方向，可以是水平的(Qt.Horizontal)或垂直的(Qt.Vertical)。

    updateValueWhileDragging属性用来设置拖动滑块时控件的当前值是否变化，默认为true。

    tickmarksEnabled属性指示是否显示刻度线，默认为false。

    hovered属性指示鼠标是否悬停在控件上方，pressed指示鼠标或手指是否按下。这两个属性都是只读的。

    activeFocusOnPress属性指示当用户按下鼠标或手指时，控件是否获得键盘焦点，默认为false。

     style属性指向一个SliderStyle对象。SliderStyle用来定制一个Slide:的外观，你可以定制面板、滑槽、滑块、刻度线四部分。control属性指向应用此风格对象的滑块控件实例。groove属性指向滑槽组件，handle指向滑块组件，tickmarks指向刻度线组件，panel指向面板组件，它们的类型都是Component。需要说明的是，一般我们只需要定制groove和handle就能够得到不错的效果。如果你要定制panel，就需要特别注意panel和groove, handle, tickmarks三者的关系。panel是整个滑块控件的可视对象的根哦，它内部使用Loader:来加载groove, handle和tickmarks，如果你要定义panel，就要自己安排其他组件的位置。