android之自定义组件一

自定义组件实现如下效果：

 

 

1）在res文件下新建一个drawable文件夹用于存放自定义组件的属性。

2）从效果图分析可以知道，此种效果是由两个EditText和一个View视图组成然后再由一个LinearLayout布局包围显示，因此需要定义一个用来定义EditText的edittext.xml和一个用来包围EditText的布局文件login_linearlayout.xml文件。

3）新建一个edittext.xml其代码如下：

<!-- edittext的样式:无边框，背景色为白 --> <shape xmlns:android="http://schemas.android.com/apk/res/android" > <!-- 渐变 -->  <gradient android:angle="0" android:endColor="#FFFFFF" android:startColor="#FFFFFF" /> <!-- 设边框 --> <stroke android:width="0.5dp"/> <!-- 设内边距 --> <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> </shape>

4）新建一个login_linearlayout.xml其代码如下：

<!-- edittext的样式:无边框，背景色为白 -->   <shape xmlns:android="http://schemas.android.com/apk/res/android" >    <!-- 渐变 -->      <gradient         android:angle="0"         android:endColor="#FFFFFF"         android:startColor="#FFFFFF" />     <!-- 设边框 -->     <stroke         android:width="0.5dp"/>     <!-- 设内边距 -->     <padding         android:bottom="10dp"         android:left="10dp"         android:right="10dp"         android:top="10dp" /> </shape>

5）最后在要显示此效果的布局文件中将这两个文件以背景图片的形式引用进来，此时activity_main.xml的代码如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     android:layout_width="match_parent"     android:layout_height="wrap_content"     android:layout_gravity="center_horizontal"     android:layout_marginLeft="10dp"     android:layout_marginRight="10dp"     android:layout_marginTop="20dip"     android:background="@drawable/login_linearlayout"     android:orientation="vertical" >       <EditText         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:background="@drawable/edittext"          android:hint="用户名"/>       <View         android:layout_width="match_parent"         android:layout_height="1dp"         android:background="#999999" />       <EditText         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:background="@drawable/edittext"          android:hint="密码"/>   </LinearLayout>

此时，上图的效果就完全实现了。