技术开发 频道

深度定制界面风格浅析

  (二)定制风格条目

  如果开发者想要进一步开发,他可能发现仅仅继承并修改系统定义好的条目不能满足他的需要。比如开发者想让定制的TestView上可以显示一个带颜色的圆圈,显然系统定义的条目没有关于圆圈的信息。那怎么来实现? 用前面介绍的简单定制就不能满足开发者的需要了。

  简单起见,这里我们假设TestView需要了解到圆圈的颜色和半径就可以绘制一个圆圈。可能有人会异议说,我们在TestView的代码里面直接写上不就可以了嘛,实现起来是没有问题。但是一旦用户修改就必须得修改代码,就有可能出错。 如果我们把这些信息可以放到自己定制的风格里面,就简单多了。如果用户想修改颜色或者大小,只需要修改定义风格xml文件的信息,不需要修改代码。

  好了,决定要添加圆圈信息了,首先在styles.xml里面,添加circleColor和circleRadius两个条目,并设置他们相应的值,示例三展示了如何添加这两个条目。是不是这样就万事大吉了那?如果你现在去编译,肯定会得到这两个条目不存在的错误信息。为什么呢?我们想一下,系统没有定义这两个条目,我们仅仅使用了这两个条目,也没有定义它们,当然不知道两个条目是什么东西了。

  如果要让系统知道有这两个条目,我们首先要定义它们。在values目录下创建一个attrs.xml文件。然后添加圆圈的半径和颜色。在attrs.xml里面可以定义很多类型的条目(item),例如integer, float, color, reference, string等。在这里只定义了两种一个是用color来定义颜色,一种是用float来定义半径。这些类型信息告诉OPhone的资源 (Resource)系统如何去解读这些字段, 具体参看示例四。

<resources>

    
<style name="Widget.TestView" parent="android:Widget">
        
<item name="android:background">#FFFFFFFF</item>
        
<item name="circleColor">#FFFF0000</item>
        
<item name="circleRadius">60</item>
    
</style>
</resources>

   示例三

<resources>
    
<!-- These are the attributes that make up customized theme. -->

    
<declare-styleable name="TestView">
        
<!-- Default TestView style. -->
        
<attr name="testViewStyle" format="reference" />

        
<!-- Color to use for the background of the Circle -->
        
<attr name="circleColor" format="color" />

        
<attr name="circleRadius" format="float"/>
    
</declare-styleable>
</resources>

   示例四

   在attrs.xml里面定义完成了,在styles.xml也添加了,现在你去编译应该不会有什么错误了。问题是,怎么让TestView知道这些信息。这两个条目是我们自己定义的,所以我们也得自己去添加一些代码让TestView了解到这些信息。以下的示例五,展示了怎么从资源总找到我们添加进去的两个条目的值。

public TestView(Context context, AttributeSet attrs, int defStyle) {
            super(context, attrs, defStyle);

            TypedArray a
=
                context.obtainStyledAttributes(
                    attrs, R.styleable.TestView, defStyle,
0);

            
int n = a.getIndexCount();
            
            
for (int i = 0; i < n; i++) {
                
int attr = a.getIndex(i);

                switch (attr) {
                
case R.styleable.TestView_circleColor:
                    mCircleColor
= a.getColor(attr, Color.RED);
                    break;
                
case R.styleable.TestView_circleRadius:
                    mCircleRadius
= a.getFloat(attr, 40f);
                    break;
                }

            }
        }

  示例五

  TestView获取到圆圈的颜色和半径信息后,就可以用这些信息去画开发者想要的圆圈了。关于如何画这个带颜色的圆圈,不是我们这里要描述的内容,请参看附件代码。

0
相关文章