android 钢琴界面实现


最近在做一个钢琴的东西,关于这个界面如何设计画了很长时间,主要是考虑到针对不同的分辨率,如果只针对一种分辨率的话用绝对布局可以实现,实现的基本思想是每个白色的键的位置是可以计算出来的,屏幕的宽度可以获得到,白键是将屏幕均匀的分成8份,所以每个白键所处的位置是可以得到的,而由于黑键的实现采用的是重写ViewGroup的方法,先计算出每个黑键的位置,然后再执行onLayout方法将黑键放在指定的位置。

布局如下:

	
	    
	        
	        
	        
	        
	        
	        
	        
	        
	    
	    
	        
	        
	        
	        
	        
	    
	

LinearLayout内的控件为白键,一共有8个白键,每个白键的权值是1000,所以每个白键的位置是可以计算出来的,com.example.crazypanp.view.BlackLayout是重写的ViewGroup.主要用来排放黑键。

代码如下:

public class BlackLayout extends ViewGroup {
	private List mLeftPositions;
	public BlackLayout(Context context, AttributeSet attrs) {
		super(context, attrs);
		mLeftPositions = new ArrayList();
	}
	
	private void addPosition(int pScreenWidth, int pChildWidth){
		int pScreenUnit = pScreenWidth / 8;
		mLeftPositions.clear();
		mLeftPositions.add(pScreenUnit - 2 * pChildWidth / 3);
		mLeftPositions.add(2 * pScreenUnit - pChildWidth / 3);
		mLeftPositions.add(4 * pScreenUnit - 2 * pChildWidth / 3);
		mLeftPositions.add(5 * pScreenUnit - pChildWidth / 2);
		mLeftPositions.add(6 * pScreenUnit - pChildWidth / 3);
	}

	@Override
	protected void onLayout(boolean arg0, int l, int t, int r, int b) {
		// TODO Auto-generated method stub
		int childCount = this.getChildCount();
		int gap = 0;
		int space=0;
		if(this.getChildCount() >= 1){
			addPosition(this.getWidth(), this.getChildAt(0).getWidth());
		}
		for( int i = 0; i < this.getChildCount(); i++){
			View child = this.getChildAt(i);
			child.measure(r - l, b - t);
		}
		for (int i = 0; i < childCount; i++) {
			View child = this.getChildAt(i);
			child.setVisibility(View.VISIBLE);
			child.measure(r - l, b - t);
			int childWidth = child.getMeasuredWidth();
			int childHeight = child.getMeasuredHeight();
			child.layout(mLeftPositions.get(i), t, mLeftPositions.get(i) + childWidth, t + childHeight);
		}
	}
}

在onLayout函数中首先确定每个黑键的位置,然后再通过onLayout函数进行位置的摆放。

你可能感兴趣的:(android)