●
【面板栈分离器】---本教程核心--掌握基础布局代码
-----本楼是试练-----
面板栈分离器才是CUI配置的主要分栏模式呢- -,面板栈分离器可以更加灵活地对其下的各个面板进行布局划分。这儿我也粗略讲下,还是在上面那界面上操作。
由于上面那界面功能按钮、进度条、音量是置于上方的,鼠标点有点远,所以将其移到中间,便于点击。
这儿采用的方法:在垂直分离器和标签栈之间插入一个面板栈分离器 ,面板栈分离器下插入 按钮、定位条、音量。
效果图及面板布局图:注意是在垂直布局界面上做的,水平那个不适合,因为不好看。
本教程只是举例浅显地举例讲方法,不考虑审美^
^




● 面板插入完成后,点击配置,先放上设置预览图


● 按钮:强制布局,填充,宽度为175,因为左边按钮宽度是175左右的。右侧填充栏里默认是四个5,不取消也行。四个5是上下左右各留出5个单位,现成边缘分隔区或者防止碰壁,这儿设为0吧,紧凑点好。175是宽度,因为是左起第一个,所以左可不设,默认为0.


● 定位条:采用填充模式,因为是第二个了,所以左起178,避开按钮的区域并稍微留点空隙,宽度:
$sub(%_width%,238) 意思是整个宽度减去238个单位,238是因为左边有178,最右侧有音量条的60,这样中间剩下的就全给进度条(定位条)了,这样播放器最大化后也能处于合理的位置。那个2是稍微将进度条下移2个单位(距离上端2个单位),没多大意思,残念而已。


● 音量:依旧采用填充模式,左:$sub(%_width%,60) 意思是离最右侧60处起开始,就是整个宽度差60处。,然后宽度设为60,这样音量条就完全填充在这左起差60到最右侧的60个单位里了。
PS:采用“使用百分比”也能实现,不过效果不好,百分比里,数字就表示百分比了,点掉填充。如:左30,宽度40,就表示,左起总宽度的30%到左起70%的距离为总距离40%的区域。
还有大神们的配置里用到的代码和排版模式要复杂得多,当然还有其他简单的,如:
$add(%_width%,xx) 但应该不常用,不过在某个方面很好用。
----------------代码解释-------------:必看
● 对应的高度不用说就是 $sub(%_height%,xx), $sub(%_width%,xx) 语句 在“左“以及$sub (%_height%,xx) 语句在 “上”里分别表示从面板最右边开始多少单位开始布局和从距离面板最下面多少开始,所谓的最哪边是指该分离器的边缘。
● $sub(%_width%,xx) 语句 在“宽度“以及$sub (%_height%,xx) 语句在 “高度”里分别表示宽度和高度分别为总宽度/高度减去那个XX值,总宽度/高度是指该分离器面板的总值,不是整个播放器。
● 当宽度和高度需要用全部,即全值时,可用 %_width%和 %_height%,或者点上”百分比“,打上100,此时数字都按百分比取值了,”左“和”上“里的数字就不是具体单位数字了,要注意。
● 右侧填充里只能用数字,不可以是负数,不过负数在左侧那边是可以用。上下左右就是4个边缘留多少空隙了 。
● 其他还有更复杂的布局代码,但上面的sub代码一般够用了,add代码类似,如:
$add(%_width%,xx) ,一个减($sub),这个是加,在整体布局时不适用。
----------------------------------------------------
插入面板栈分离器后,全屏下的排版,按钮、进度条、音量也能准确排布了。

-----试练完毕----楼下
讲面板栈分离器整体布局