首页 > 代码库 > 记分牌

记分牌

     我们知道使用FlipViewController可以展示立体额翻页效果,左右翻页,上下翻页,现在使用FlipViewController来模拟一个记分牌效果。

1.首先要导入FlipViewController类所在的aphid-flipview-library。

下载地址:http://download.csdn.net/detail/forwardyzk/8333027

2.定义一个类ScoreBoardView继承LinearLayout

加载LinearLayout中的xml布局文件

layout_scoreboard_view.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="match_parent"
    android:orientation="horizontal"
    tools:context="com.yzk.filpviewdemo.MainActivity" >

    <com.aphidmobile.flip.FlipViewController
        android:id="@+id/flipViewLeft"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_marginRight="5dp"
        android:layout_weight="1" >
    </com.aphidmobile.flip.FlipViewController>

    <com.aphidmobile.flip.FlipViewController
        android:id="@+id/flipViewRight"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_marginLeft="5dp"
        android:layout_weight="1" >
    </com.aphidmobile.flip.FlipViewController>

</LinearLayout>

现在初始化View

public void initView() {
		View.inflate(mContext, R.layout.layout_scoreboard_view, this);
		flipViewLeft = (FlipViewController) findViewById(R.id.flipViewLeft);
		flipViewRight = (FlipViewController) findViewById(R.id.flipViewRight);
		flipViewLeft.setAdapter(new FlipViewAdapter(
				android.R.color.holo_red_dark));
		flipViewRight.setAdapter(new FlipViewAdapter(android.R.color.black));
	}


3.给FlipViewController设置的适配器

class FlipViewAdapter extends BaseAdapter {
		private int mColor;

		public FlipViewAdapter(int color) {
			this.mColor = color;
		}

		@Override
		public int getCount() {
			return 10;
		}

		@Override
		public Object getItem(int position) {
			return position;
		}

		@Override
		public long getItemId(int position) {
			return position;
		}

		@Override
		public View getView(int position, View convertView, ViewGroup parent) {
			ViewHolder holder = null;
			if (convertView == null) {
				holder = new ViewHolder();
				convertView = View.inflate(mContext, R.layout.item_text_view,
						null);
				holder.tv_score = (TextView) convertView
						.findViewById(R.id.tv_score);
				convertView.setTag(holder);
			} else {
				holder = (ViewHolder) convertView.getTag();
			}
			holder.tv_score.setTextColor(mContext.getResources().getColor(
					mColor));
			holder.tv_score.setText(String.valueOf(getItem(position)));
			return convertView;
		}

	}


设置对应的显示数字的颜色
item对应的布局文件

item_text_view.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/tv_score"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/white"
        android:gravity="center"
        android:text="0"
        android:textColor="@android:color/black"
        android:textSize="130sp" />

</LinearLayout>


使用步骤:

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="match_parent"
    android:orientation="horizontal"
    tools:context="com.yzk.filpviewdemo.MainActivity" >

    <com.yzk.view.ScoreBoardView
        android:id="@+id/scoreview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </com.yzk.view.ScoreBoardView>

</LinearLayout>




MainActivity.java

public class MainActivity extends Activity {

	private ScoreBoardView view;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		view = (ScoreBoardView) findViewById(R.id.scoreview);
	}

	@Override
	protected void onResume() {
		super.onResume();
		view.onResume();
	}

	@Override
	protected void onPause() {
		super.onPause();
		view.onPause();
	}
}

源码下载地址:http://download.csdn.net/detail/forwardyzk/8333517


默认是纵向

如果设置横向:

 FlipViewController flip = new FlipViewController(mContext,FlipViewController.HORIZONTAL);

或者布局文件中设置

 <com.aphidmobile.flip.FlipViewController
        android:id="@+id/flipViewLeft"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_marginRight="5dp"
        android:layout_weight="1"
        app:orientation="horizontal" >
    </com.aphidmobile.flip.FlipViewController>

效果图:

技术分享




记分牌