控件的一些处理（二）

  在做项目中很多时候会对按钮的点击做个动态效果，实现这个效果，可以用OnTouchListener接口来实现，也可以在res包中创建drawable包，在drawable包创建一个xml文件选择selector样式。再把这个xml文件作为控件的背景。

使用OnTouchListener接口来实现：

// 设置按钮的Down和Up的背景变化(以前是textView上面是图片成为按钮)现在是ImageButton private class NotepadOnTouchListener implements OnTouchListener { @Override public boolean onTouch(View v, MotionEvent event) { switch (event.getAction()) { case MotionEvent.ACTION_DOWN://按下按钮改变控件图片 // Drawable // drawable=getBaseContext().getResources().getDrawable(R.drawable.note_notepad); // mNotepad.setCompoundDrawablesWithIntrinsicBounds(null, // drawable, null, null); mNotepad.setBackgroundResource(R.drawable.note_notepad); break; case MotionEvent.ACTION_UP://松开按钮改变控件图片 // Drawable // drawable1=getBaseContext().getResources().getDrawable(R.drawable.note_notepad_default); // mNotepad.setCompoundDrawablesWithIntrinsicBounds(null, // drawable1, null, null); mNotepad.setBackgroundResource(R.drawable.note_notepad_show); break; default: break; } return false; } }

 

上面是定义了一个实现了 OnTouchListener 接口，也可以直接setOnTouchListener来实现。
mNotepad.setOnTouchListener(new NotepadOnTouchListener());

用xml来实现如下：

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" >     <!-- 没有焦点时的背景图片 -->    <item android:drawable="@drawable/note_notepad_show" android:state_pressed="false"/>    <!-- 选中时的图片背景 -->    <item android:drawable="@drawable/note_notepad" android:state_pressed="true"/>    <!-- 获得焦点时的图片背景 -->    <item android:drawable="@drawable/note_notepad" android:state_focused="true"/>    <!-- 默认时的背景图片 -->    <item android:drawable="@drawable/note_notepad_show"/></selector>

把Button的背景资源设置为上面的样式

<Button                android:id="@+id/notes_notepad"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="center"                android:layout_marginLeft="4dp"                android:layout_weight="1"                android:background="@drawable/notes_notepad_bt" />

把SeekBar的进度条的头改成自己做的，也是在drawable文件中创建一个xml选择selector样式，在把SeekBar中的thumb属性该为我们创建的样式

代码如下：

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" >     <!-- 按下状态 -->      <item android:state_pressed="true" android:drawable="@drawable/data_progress" />        <!-- 普通无焦点状态 -->      <item android:state_focused="false" android:state_pressed="false"          android:drawable="@drawable/data_progress" />      </selector>

控件SeekBar代码如下：

<SeekBar            android:id="@+id/note_seekBar"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_gravity="center_vertical"            android:layout_weight="1"            android:thumb="@drawable/thumb" />

把SeekBar的进度条改成自己做的，也是在drawable文件中创建一个xml选择layer-list样式，在把SeekBar中的tprogressDrawable属性该为我们创建的样式

<?xml version="1.0" encoding="utf-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android"><item android:id="@android:id/background">        <shape>            <corners android:radius="5dip" />            <gradient                android:angle="270"                android:centerColor="#3a360a"                android:centerY="0.75"                android:endColor="#3a360a"                android:startColor="#3a360a" />        </shape>    </item>    <item android:id="@android:id/progress">        <clip>            <shape>                <corners android:radius="5dip" />                <gradient                    android:angle="270"                    android:centerColor="#f5cd17"                    android:centerY="0.75"                    android:endColor="#f5cd17"                    android:startColor="#f5cd17" />            </shape>        </clip>    </item>    <item android:id="@android:id/secondaryProgress">        <clip>            <shape>                <corners android:radius="5dip" />                <gradient                    android:angle="270"                    android:centerColor="#3a360a"                    android:centerY="0.75"                    android:endColor="#3a360a"                    android:startColor="#3a360a" />            </shape>        </clip>    </item></layer-list>

控件SeekBar代码如下：

<SeekBar                android:id="@+id/brush_size_seek"                android:layout_width="match_parent"                android:layout_height="15dip"                android:max="50"                android:maxHeight="12dp"                android:paddingLeft="10dip"                android:paddingRight="10dip"                android:thumbOffset="0dip"                android:progressDrawable="@drawable/seekbar_progress"                android:secondaryProgress="0"                android:thumb="@drawable/seek_thumb" />

自定义SeekBar会出现滑块滑到最开始和滑到最后面时滑块会消失android:thumbOffset="0dip"这个属性就是避免这种情况发生的，所以一定要设置这个属性。

把CheckBox的选择图标换成自己做的图片，也是在drawable文件中创建一个xml选择selector样式，在把CheckBox中的button属性该为我们创建的样式

代码如下：

<selector xmlns:android="http://schemas.android.com/apk/res/android" >    <item android:state_checked="true" android:drawable="@drawable/data_pitch_on" /> <!-- checked -->      <item android:state_checked="false" android:drawable="@drawable/data_select_kuang" /> <!-- default -->  </selector>

控件CheckBox代码如下：

<CheckBox        android:id="@+id/cb_edit_item"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginLeft="10dip"        android:button="@drawable/checkbox"        android:checked="false"        android:focusable="false"        android:layout_gravity="center" />

我们使用的一些app中我们经常会看到一些控件的左右上下角有休息较小的标志，比如我们使用的QQ，有消息的时候一些控件左上角会显示一些数字提醒有几条消息，还有我们进入一些手机中的相册我们选择的图片右上角会显示出一个小勾，标识我们已经选中了等。要实现这样的效果使用FrameLayout布局就能实现，在FrameLayout布局中放一个控件再修改控件android:layout_gravity="bottom|right"属性。bottom整个布局的下方，Top整个布局的上方，right布局的右方，left 布局的左方。
图片下面有个小图标代码如下：

<FrameLayout            android:layout_width="0dip"            android:layout_height="match_parent"            android:layout_weight="1" >            <ImageView                android:id="@+id/iv_bg_yellow"                android:layout_width="35dip"                android:layout_height="35dip"                android:layout_gravity="center"                android:src="@drawable/image_yellow" />            <ImageView                android:id="@+id/iv_bg_yellow_select"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="bottom|right"                android:layout_marginBottom="0dip"                android:layout_marginRight="6dip"                android:focusable="false"                android:src="@drawable/selected"                android:visibility="gone" />        </FrameLayout>

textView上面有个小图标代码如下：

<FrameLayout                    android:layout_width="0dip"                    android:layout_height="wrap_content"                    android:layout_weight="1" >                    <TextView                        android:id="@+id/note_remind_time"                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:layout_gravity="right|top"                        android:layout_marginRight="14dp"                        android:layout_marginTop="6dp"                        android:background="@drawable/data_remind_text"                        android:gravity="center"                        android:visibility="gone" />                    <Button                        android:id="@+id/note_remind_time_bt"                        android:layout_width="15dip"                        android:layout_height="15dip"                        android:layout_gravity="right|top"                        android:background="@drawable/data_remind_close"                        android:focusable="false"                        android:visibility="gone" />                </FrameLayout>

GridView 控件调整每个item间距

<GridView        android:id="@+id/background_lis_gridView"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:horizontalSpacing="5dp"        android:numColumns="3"        android:padding="10dip"android:scrollbars="none"         android:verticalSpacing="10dp" >    </GridView>

horizontalSpacing 调整左右间距，verticalSpacing 调整上下间距，numColumns限制每列数量，scrollbars="none"隐藏滑块。

图片的显示，有的时候我们需要在ImageView中只显示图片一半点击图片进入查看全图，我们只要设置Image的scaleType属性：

android:scaleType=""---控件如何显示

 参数：center---按图片原来的尺寸居中显示，当图片的长（宽）超过view的长（宽），则截取图片居中部分显示
            centerCrop---按比例扩大图片的尺寸居中显示，使得图片长（宽）等于或大于view的长（宽）
            centerInside---将图片的内容完整居中显示，通过按比例缩小或原来的尺寸使得图片长（宽）小于或等于view的长（宽）
            fitCenter---把图片按比例扩大/缩小到view的宽度，居中显示
            fitEnd---把图片按比例扩大/缩小到view的宽度，显示在view的下半部分位置
            fitStart---把图片按比例扩大/缩小到view 的宽度，显示在view的上半部分位置
            fitXY---把图片不按比例扩大/缩小到view的大小显示
            matrix---用矩阵来绘制