先看一個常用的圖，如下：

?

左邊是導航欄，右邊是信息區。

中間可以自由拉伸。

XML如下：

<?xml version="1.0" encoding="utf-8" standalone="yes" ?><Window size="695,542"><HorizontalLayout width="695" height="542" bkcolor="#FFA0A0A4"><HorizontalLayout width="200" bkcolor="#FF008080" sepwidth="6" sepimm="true" /><HorizontalLayout bkcolor="#FFA6CAF0" /></HorizontalLayout></Window>

?

sepwidth 全稱為 seperator width，分隔條的寬度。這個值分正值、負值，正值表示分隔條在右邊，負值表示分隔條在左邊。

?

sepimm 全稱為 separate immediately，立即拉伸，即鼠標一移動，馬上就設置LAYOUT的大小。

?

DUILIB似乎有一個BUG，就是當左邊被拖到寬度為0時，它為自動還原為原始大小。為了解決這個BUG，我們需要設置它的最小寬度，minwidth=”1”，這樣BUG就不存在了咯。

?

解決這個BUG的時候，你也已經知道，如何限制左邊的LAYOUT的大小了吧，maxwidth，如果設置了這個屬性，指定了最大寬度，那它就會限制在一定大小了。以下的XML，讀者可作測試：

<?xml version="1.0" encoding="utf-8" standalone="yes" ?><Window size="695,542"><HorizontalLayout width="695" height="542" bkcolor="#FFA0A0A4"><HorizontalLayout minwidth="50" maxwidth="300" width="200" bkcolor="#FF008080" sepwidth="6" sepimm="true" /><HorizontalLayout bkcolor="#FFA6CAF0" /></HorizontalLayout></Window>

?

這里要說明一個非常重要的規則：

如果分隔條是豎條的，｜，那分隔條屬性為sepwidth，它的LAYOUT必須是HorizontalLayout，即水平布局，因為只有水平布局被水平拉伸才是合理的。

如果分隔條是橫條的，一，那分隔條屬性為sepheight，它的LAYOUT必須是VerticalLayout，即垂直布局，因為只有垂直布局被垂直拉伸才是合理的。

?

所以，在上面的XML中，如果你將左邊的LAYOUT換成VerticalLayout，你會發現分隔條無效，因為VerticalLayout根本沒有sepwidth屬性。

?

在設置橫條的分隔條時，需要設置minheight、maxheight屬性，這樣便于控制其大小。sepheight為正時，表示分隔條在下方，為負時，表示在上方。

?

下面我貼一個擁有上下、左右分隔條的XML，同時包含正負值。

?

XML:

<?xml version="1.0" encoding="utf-8" standalone="yes" ?><Window size="695,542"><HorizontalLayout width="695" height="542" bkcolor="#FFA0A0A4"><HorizontalLayout sepwidth="5" sepimm="false" minwidth="50" maxwidth="300" width="137" bkcolor="#FF008080" /><VerticalLayout><VerticalLayout bkcolor="#FF103A78" /><VerticalLayout bkcolor="#FF5D4425" minheight="50" sepheight="-5" sepimm="true"/></VerticalLayout></HorizontalLayout></Window>

?

總結

以上是生活随笔為你收集整理的Duilib教程－自动布局3－分隔条的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。