转载请说明原出处，谢谢~~

       花了两天时间把仿酷狗的选项设置窗体做出来了，当然了只是做了外观。现在开学了，写代码的时间减少，所以整个仿酷狗的工程开发速度减慢了。今天把仿酷狗的选项设置窗体的布局代码分享出来，给学习duilib布局的朋友做个demo。现在编写的仿酷狗选项设置窗体和原酷狗的窗体不细看几乎看不出差别，控件的布局位置和原酷狗最多只有几个像素的位置差别。

       先来看一下原酷狗的选项设置窗体的其中一个页面：

       如果还不太会布局的朋友可以先看我前些日子写的关于duilib布局的博客《duilib各种布局的作用，相对布局与绝对布局的的意义与用法》。可以看出来，选项设置窗体的整体布局并不复杂，但是其中分为多个页面，而每个页面里面又有许多控件，所以写这个窗体的布局简单而繁琐。这是我的眼中的布局图：

        左侧使用纵向布局内嵌Option控件实现，而右侧界面的主界面使用TabLayout布局实现切换的功能。每个页面使用纵向布局来做容器。

       在设置窗体里大量用到Label、Button、Option、CheckBox控件，为了避免重复写属性代码，所以应该使用Default标签定义这几个控件的默认属性，比如字体颜色，禁用状态下的字体颜色，CheckBox控件的状态图等。这里给出默认标签的代码：

<Default name="Label" value=http://www.mamicode.com/"autocalcwidth="true" textcolor="#FF454545" " />>
       我这里使用了autocalcwidth属性，这是我另外添加的属性，是群里朋友修改的代码。用来让Label控件根据问题内容而自动计算宽度，这样可以省去很多时间让我专心把时间投入到布局上面。
       如同我在前面的博客提到的，能不使用绝对布局就不用，所以在这整个布局代码中，只有两三处必须用绝对布局的地方我才使用了绝对布局，其余代码都是使用相对布局。所以这些布局代码可以帮助duilib新手朋友学习相对布局的用法。
      开发仿酷狗时我使用的是duilib的扩展版本uilib库，而且我又对uilib库进行过很多次的bug和性能修复（具体的修复代码可以从前面的博客看到），所以今天发出来的布局代码大家不能直接拷贝后使用，而要根据自己的情况进行必要的修改。没有什么其他要点了，直接发出效果图。一共九张 ，分别对应酷狗选项设置窗体的九个页面。

       下面把完全的布局代码贴出来，博客最后会把布局的下载链接也发出来：
<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<Window size="632,484" sizebox="4,4,4,4" caption="0,0,0,30" mininfo="632,484" roundcorner="3,3" bktrans="false" >
    <Font name="宋体" size="12" default="true"/>
    <Font name="宋体" size="12" bold="true" />
    <Default name="Label" value=http://www.mamicode.com/"autocalcwidth="true" textcolor="#FF454545" " />>
        xml布局文件下载地址：点击打开链接
   Redrian   2014.8.26
仿酷狗音乐播放器开发日志二十四 选项设置窗体的实现（附328行xml布局源码）