layout方法的简单使用案例

layout代表着某一个view在父view中的位置,比如
ViewGroup parent = new ViewGroup();
View child = new View();
parent.addView(child)
child.layout(l,t,r,b);
ps:用new 来初始化对象只是为了方便说明情况
此时child是parent的子View,child.layout(l,t,r,b)就说明了child在parent放置的坐标位置,坐标原点(0,0)就是parent的左上角。

其中(l,t)代表着左上角的位置,(r,b)代表着右下角的位置。

使用案例,如下这个页面:该页面有多个view可以获取焦点,并在获取到焦点的view上赋予一个焦点框。

layout方法的简单使用案例_第1张图片

刚开始实现这个页面的时候使用切图的方法,也就是把每个view的焦点框切一个图,放在


    
    
    
    
    

这中配置文件来让一个设置一个view的background.但是这样做有一个问题:这个页面有几个不同大小的view需要焦点框效果。也就是说要让美工针对不同的view来切不同的焦点框。要知道这只是应用的一个界面,还有其他的页面同样需要获取焦点框,那么就还得让美工切图。这样的话就得为每个焦点框配置一个selector这种重复性的工作。
下面就用另外一种方法来,该是layout出场的时候了:

思路:
1)提供一个.9图片的焦点框(当然焦点框也可以用shape来实现焦点框)


2)提供一个ImageView,这个ImageView的src就是.9图片,假设该ImageView的变量名为focusImgView
3)对页面focusable为true的view设置FoncusChangeListener,如果某个view获取焦点的话,获取该view的左上角的位置(x,y)和它的宽度(width,height).然后设置
focusImgView.layout(x,y,x+width,y+height)(因为android中没有直接的方法来获取某个view右下角的位置,所以需要通过宽和高来计算之)

基本的代码如下:

/**焦点框View**/
public class FocusView extends ViewGroup{
    /**焦点框**/
	private ImageView focusImgView;
	/**页面中获取焦点的view**/
	private View focusView;	
	/*焦点.9图片*/
	private Drawable mViewFocusDrawable;
	public FocusView(Context context,Drawable mViewFocusDrawable) {
		super(context);
		init(mViewFocusDrawable);
	}
	
	
	private void init(Drawable mViewFocusDrawable) {
		focusImgView = new  ImageView(getContext());
		ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
		addView(focusImgView, params);
		focusImgView.setBackgroundDrawable(mViewFocusDrawable);
	}

	/**
	 * 设置焦点的图片
	 * @param d
	 */
	public void setFocusDrawable(Drawable mViewFocusDrawable) {
		focusImgView.setBackgroundDrawable(mViewFocusDrawable);
	}
	
	/*
	*@focusView 获取焦点的view
	*/
	public void showFocus(View focusView) {
		
		int[] location = new int[2];
		focusView.getLocationInWindow(location);
		int x = location[0];
		int y = location[1];
		int width = focusView.getWidth();
		int height = focusView.getHeight();
	        //这是重点步骤
		focusImgView.layout(x, y,x+ width,y + height);
	}


	@Override
	protected void onLayout(boolean changed, int l, int t, int r, int b) {
	}
	
}
在onFoucusChange方法里面这么调用:
	@Override
	public void onFocusChange(View view, boolean hasfocus) {

		int viewId = view.getId();
		switch (viewId) {
		case R.id.demo_btn:
			if (hasfocus) {
				mFocusView.showFocus(view);
			}
			break;
		}
	}

这样一个简单的.9图片就能够满足页面的应用:其他页面使用的效果图:

layout方法的简单使用案例_第2张图片


你可能感兴趣的:(android)