android 设置文字周围图片显示

一个搜索框 ，在框里面左边是一个搜索图标，后面是一个输入框( EditText )输入文字的时候左边的搜索图标要一直存在。

之前的做法是让美工切一个包含搜索图标的背景透明的图片，然后布局的时候外层一个LinearLayout,将该图片作为LinearLayout的背景图片，然后LinearLayout的里面放一个EditText并设置marginleft 使光标正好在搜索图标的右边。这种做法实在是太麻烦了。要考虑适配屏幕，还要一个一个像素的试，看看多少像素合适。

今天才知道android提供了动态设置空间四周的图片显示的功能。

像上面这种效果，

首先需要切一个搜索图标，和一张透明带边框的输入背景图片；

@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		edit = (EditText) this.findViewById(R.id.edit);

		Drawable d = getResources().getDrawable(R.drawable.abs__ic_search);

		d.setBounds(0, 0, d.getMinimumWidth(), d.getMinimumHeight());

		edit.setCompoundDrawables(d, null, null, null);
	}

下面分代码形式和XML形式 实现：

代码形式：

布局文件代码

<LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/input_background" >

        <EditText
            android:id="@+id/edit"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:hint="请输入..." />
    </LinearLayout>

代码如下：

@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		edit = (EditText) this.findViewById(R.id.edit);

		Drawable d = getResources().getDrawable(R.drawable.abs__ic_search);

		d.setBounds(0, 0, d.getMinimumWidth(), d.getMinimumHeight());
		//设置EditText中文字左边的显示图标，上面 、右边 、下面 没有则置空null
		edit.setCompoundDrawables(d, null, null, null);
	}

XML布局形式：

布局文件代码：

<LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/input_background" >

        <EditText
            android:id="@+id/edit"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@null"
            android:drawableLeft="@drawable/abs__ic_search"
            android:hint="请输入..." />
    </LinearLayout>

android:drawableLeft 就是设置文字左边显示的图标。

代码里面只需要引入这个布局就OK了。