Androidカスタムコンポーネント(一)
Androidカスタムコンポーネント(一)
オリジナルコンポーネントでは、上書きや組み合わせなどを避けて、自分のコンポーネントを定義することができ、後で多重化するのに便利です.たとえば、前のプロジェクトで何度もファイルブラウザコンポーネントが表示されました.
う~ん、どうまとめたらいいのかな?
一、概説
カスタムコンポーネントは、このように分けることができるでしょう.一、ViewまたはSurfaceView上の自己描画;二、View Groupレイアウトサブクラス統合;三、はっきりしないよ~、いい点数もないみたい=.
本文の工事は、個人的に主に属性資源の使用だと感じていますか?工事の主な例は以下の通りである.
名前
効果
ツールバーの
ロードダイナミック...の効果コンポーネント
loading...のダイナミック効果
次の4つのプロパティが定義されています.
1)loadImage:loadワードピクチャ、referenceタイプ
2)pointImage:小点画像、referenceタイプ
3)pointCount:小点数、integerタイプ
4)msecRate:ミリ秒レベル変化速度、integerタイプ
Titleバックグラウンドシフトのエフェクトコンポーネント
集合ビューレイアウト、タイトルバーを形成します.タイトル項目の下の背景移動の小さな効果を実現しました.
次のプロパティが定義されています.
1)titleLayout:タイトルバーレイアウト
2)bgImage:item背景画像
3)bgLeftMargin:バックグラウンド初期左ピッチ
4)animTime:アニメーション時間の移動
ViewPagerバインドタイトルの効果コンポーネント
ViewPagerはタイトルバーをバインドし、タイトル項目の下の背景移動の小さな効果を実現します.
効果の特徴は次のとおりです.
1)背景はViewPagerのスクロールに従って同期してタイトル間でスクロールする
2)タイトルをクリックすると、ViewPagerプログラムがスクロール&バックグラウンド同期を制御
属性の定義は次のとおりです.
1)tLayout:タイトルバーレイアウト
2)bImage:item背景画像
3)bMargin:背景初期左ピッチ
ListView引き出しの効果コンポーネントを追加
ListViewは引き出しの効果コンポーネントを追加します.引き出しが開いているインターフェースは1つしか使いませんでした.
1)listView:リストビューid,referenceタイプ
2)drawerContent:引き出しコンテンツビューid,referenceタイプ
3)drawerClose:引き出し内容のクローズボタンid,referenceタイプ
より多くのタイトルを非表示にできるコンポーネントをカスタマイズ
集合ビューレイアウト、タイトルバーを形成します.タイトル数の制限を超えると、より多くの効果が自動的に表示されます.
初期化には、次の手順に従います.
1)表示数の制限を設定します.デフォルトは6です.
2)タイトルの内容をバインドします.String[]の場合、直接TextViewで==が表示されます.
3)より多くの操作をバインドするビューid.自分でロードし、クリックイベントを設定します.
4)より多く表示されるビューをバインドします.既存のViewGroupである必要があります.制限を超えたタイトルコンテンツが自動的にロードされます(TextView).詳細については、表示または非表示を制御します.
また、コンテンツをリフレッシュする方法を提供し、一、タイトルバーのコンテンツの再ロード;二、より多くの表示内容の再ロード.
ライブダイナミックデータ線の描画
Viewで描画したリアルタイムデータ表示コンポーネントを利用しますか?
この文書を書いた時に入ってきたので、めちゃくちゃになったような気がします.
2点ズームは正しくないようですね?2つのタッチポイントが合っていないはずなので、1つの指がトリガーした2つのポイントが得られたので、一気に拡大しました.(推測ですが、とにかく修理はしません^^)
以下では「ViewPager拡張コンポーネント」を例にとりますが、ついでにViewPagerコンポーネントを見ることができます^^.
二、手順
属性リソースを使用して、レイアウトを統合してカスタムコンポーネントを構築するには~
1
)attrs.xml
コンポーネントに必要なプロパティを定義します.使わないと、クラスがカスタムコンポーネントに相当し、これらのものと結びつかないことになります.「より多くのタイトルを非表示にできるコンポーネントをカスタマイズ」は、属性も定義されていません==です.
ViewPager拡張コンポーネント定義の内容:
2
)item.xml
xmlのresourcesラベル内であれば、単独で出すのがベストです.ビューに使用するidを以下のように定義.setId(int id)は、主に相対レイアウト時に、あるidに対するViewなどに用いられる.
ViewPager拡張コンポーネント定義の内容:
3
)コンポーネントの作成
クラスで属性リソースを参照します.ViewPagerの使用説明を見てみましょう.OnPageChangeListenerインタフェースメソッドとPagerAdapterアダプタ内のメソッドのコメントです.
Android
カスタムコンポーネント(2)
添付ファイルの工事、(二)を参照してください.
オリジナルコンポーネントでは、上書きや組み合わせなどを避けて、自分のコンポーネントを定義することができ、後で多重化するのに便利です.たとえば、前のプロジェクトで何度もファイルブラウザコンポーネントが表示されました.
う~ん、どうまとめたらいいのかな?
一、概説
カスタムコンポーネントは、このように分けることができるでしょう.一、ViewまたはSurfaceView上の自己描画;二、View Groupレイアウトサブクラス統合;三、はっきりしないよ~、いい点数もないみたい=.
本文の工事は、個人的に主に属性資源の使用だと感じていますか?工事の主な例は以下の通りである.
名前
効果
ツールバーの
ロードダイナミック...の効果コンポーネント
loading...のダイナミック効果
次の4つのプロパティが定義されています.
1)loadImage:loadワードピクチャ、referenceタイプ
2)pointImage:小点画像、referenceタイプ
3)pointCount:小点数、integerタイプ
4)msecRate:ミリ秒レベル変化速度、integerタイプ
Titleバックグラウンドシフトのエフェクトコンポーネント
集合ビューレイアウト、タイトルバーを形成します.タイトル項目の下の背景移動の小さな効果を実現しました.
次のプロパティが定義されています.
1)titleLayout:タイトルバーレイアウト
2)bgImage:item背景画像
3)bgLeftMargin:バックグラウンド初期左ピッチ
4)animTime:アニメーション時間の移動
ViewPagerバインドタイトルの効果コンポーネント
ViewPagerはタイトルバーをバインドし、タイトル項目の下の背景移動の小さな効果を実現します.
効果の特徴は次のとおりです.
1)背景はViewPagerのスクロールに従って同期してタイトル間でスクロールする
2)タイトルをクリックすると、ViewPagerプログラムがスクロール&バックグラウンド同期を制御
属性の定義は次のとおりです.
1)tLayout:タイトルバーレイアウト
2)bImage:item背景画像
3)bMargin:背景初期左ピッチ
ListView引き出しの効果コンポーネントを追加
ListViewは引き出しの効果コンポーネントを追加します.引き出しが開いているインターフェースは1つしか使いませんでした.
1)listView:リストビューid,referenceタイプ
2)drawerContent:引き出しコンテンツビューid,referenceタイプ
3)drawerClose:引き出し内容のクローズボタンid,referenceタイプ
より多くのタイトルを非表示にできるコンポーネントをカスタマイズ
集合ビューレイアウト、タイトルバーを形成します.タイトル数の制限を超えると、より多くの効果が自動的に表示されます.
初期化には、次の手順に従います.
1)表示数の制限を設定します.デフォルトは6です.
2)タイトルの内容をバインドします.String[]の場合、直接TextViewで==が表示されます.
3)より多くの操作をバインドするビューid.自分でロードし、クリックイベントを設定します.
4)より多く表示されるビューをバインドします.既存のViewGroupである必要があります.制限を超えたタイトルコンテンツが自動的にロードされます(TextView).詳細については、表示または非表示を制御します.
また、コンテンツをリフレッシュする方法を提供し、一、タイトルバーのコンテンツの再ロード;二、より多くの表示内容の再ロード.
ライブダイナミックデータ線の描画
Viewで描画したリアルタイムデータ表示コンポーネントを利用しますか?
この文書を書いた時に入ってきたので、めちゃくちゃになったような気がします.
2点ズームは正しくないようですね?2つのタッチポイントが合っていないはずなので、1つの指がトリガーした2つのポイントが得られたので、一気に拡大しました.(推測ですが、とにかく修理はしません^^)
以下では「ViewPager拡張コンポーネント」を例にとりますが、ついでにViewPagerコンポーネントを見ることができます^^.
二、手順
属性リソースを使用して、レイアウトを統合してカスタムコンポーネントを構築するには~
1
)attrs.xml
コンポーネントに必要なプロパティを定義します.使わないと、クラスがカスタムコンポーネントに相当し、これらのものと結びつかないことになります.「より多くのタイトルを非表示にできるコンポーネントをカスタマイズ」は、属性も定義されていません==です.
ViewPager拡張コンポーネント定義の内容:
-
- <declare-styleable name="TitleViewPager">
- <attr format="reference" name="tLayout" />
- <attr format="reference" name="bImage" />
- <attr format="integer" name="bMargin" />
- declare-styleable>
2
)item.xml
xmlのresourcesラベル内であれば、単独で出すのがベストです.ビューに使用するidを以下のように定義.setId(int id)は、主に相対レイアウト時に、あるidに対するViewなどに用いられる.
ViewPager拡張コンポーネント定義の内容:
- <item name="containerLayout" type="id"/>
3
)コンポーネントの作成
クラスで属性リソースを参照します.ViewPagerの使用説明を見てみましょう.OnPageChangeListenerインタフェースメソッドとPagerAdapterアダプタ内のメソッドのコメントです.
- public class TitleViewPager extends RelativeLayout implements
- OnPageChangeListener, View.OnClickListener {
-
- private Context mContext; //
- private LayoutInflater mInflater; //
-
- private int titleLayoutId; // id
- private int bgImageResId; // item id
- private int bgLeftMargin; //
-
- private View titleLayout; //
- private ImageView mBgImage; // item
- private ArrayList
mItemViews; //
-
- private ViewPager mViewPager; // ViewPager
- private ArrayList
mPageViews; //
-
- private int prevOffset = -1; // ， int
- private int currentIndex; //
- private int previousIndex; //
- private boolean isTitleClicked; //
-
- private OnPageChangeListener mOnPageChangeListener; //
-
- // private final int REFRESH_RATE = 20; // 20msec
- // private Scroller mScroller; //
- // private static final Interpolator sInterpolator = new Interpolator() {
- // public float getInterpolation(float t) {
- // t -= 1.0f;
- // return t * t * t + 1.0f;
- // }
- // };
-
- public TitleViewPager(Context context, AttributeSet attrs) {
- super(context, attrs);
-
- mContext = context;
- mInflater = (LayoutInflater) context
- .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
-
- // TypedArray
- TypedArray typedArray = context.obtainStyledAttributes(attrs,
- R.styleable.TitleViewPager);
- // id， 0
- titleLayoutId = typedArray.getResourceId(
- R.styleable.TitleViewPager_tLayout, 0);
- // item id， 0
- bgImageResId = typedArray.getResourceId(
- R.styleable.TitleViewPager_bImage, 0);
- // ， 0
- bgLeftMargin = typedArray.getInt(R.styleable.TitleViewPager_bMargin, 0);
-
- initLayout(); // &ViewPager
-
- mItemViews = new ArrayList
();
- mPageViews = new ArrayList
();
- }
-
- // &ViewPager
- private void initLayout() {
- RelativeLayout containerLayout = new RelativeLayout(mContext); //
- containerLayout.setId(R.id.containerLayout); //
- LayoutParams containerParams = new LayoutParams(
- LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT); // WRAP_CONTENT， WRAP_CONTENT
- containerParams.addRule(RelativeLayout.ALIGN_PARENT_TOP,
- RelativeLayout.TRUE); //
- containerParams.addRule(RelativeLayout.CENTER_HORIZONTAL,
- RelativeLayout.TRUE); //
- addView(containerLayout, containerParams); //
- if (0 != bgImageResId) {
- mBgImage = new ImageView(mContext); // item
- mBgImage.setImageResource(bgImageResId); // item
- LayoutParams p_w_picpathParams = new LayoutParams(
- LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); // WRAP_CONTENT， WRAP_CONTENT
- p_w_picpathParams.addRule(RelativeLayout.CENTER_VERTICAL,
- RelativeLayout.TRUE); //
- p_w_picpathParams.leftMargin = bgLeftMargin; //
- containerLayout.addView(mBgImage, p_w_picpathParams); // item
- }
- if (titleLayoutId != 0) {
- titleLayout = mInflater.inflate(titleLayoutId, this, false); //
- LayoutParams titleParams = new LayoutParams(
- LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT); // WRAP_CONTENT， WRAP_CONTENT
- titleParams.addRule(RelativeLayout.CENTER_HORIZONTAL,
- RelativeLayout.TRUE); //
- titleParams.addRule(RelativeLayout.CENTER_VERTICAL,
- RelativeLayout.TRUE); //
- containerLayout.addView(titleLayout, titleParams); //
- }
- mViewPager = new ViewPager(mContext); // ViewPager
- mViewPager.setAdapter(new MPagerAdapter()); // ViewPager
- mViewPager.setOnPageChangeListener(this); //
- LayoutParams viewPagerParams = new LayoutParams(
- LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT); // FILL_PARENT， FILL_PARENT
- viewPagerParams.addRule(RelativeLayout.BELOW, containerLayout.getId()); //
- viewPagerParams.addRule(RelativeLayout.CENTER_HORIZONTAL,
- RelativeLayout.TRUE); //
- addView(mViewPager, viewPagerParams); // ViewPager
- }
-
- //
- public void addBindedPage(int pageViewId, int titleItemId) {
- mPageViews.add(mInflater.inflate(pageViewId, this, false));
- View item = titleLayout.findViewById(titleItemId);
- item.setOnClickListener(this);
- mItemViews.add(item);
- }
-
- //
- public int getCount() {
- return mPageViews.size();
- }
-
- // （ UI ， onWindowFocusChanged()）
- public void setPage(int index) {
- setImagePosition(index); //
- mViewPager.setCurrentItem(index, false); // ViewPager
- }
-
- //
- public void setCurrentPage(int index, boolean isAnim) {
- previousIndex = currentIndex; //
- currentIndex = index; //
- mViewPager.setCurrentItem(index, isAnim); // ViewPager
- // Title ViewPager
- }
-
- //
- private void setImagePosition(int index) {
- previousIndex = currentIndex; //
- currentIndex = index; //
- if (null == mBgImage) {
- return;
- }
- LayoutParams params = (RelativeLayout.LayoutParams) mBgImage
- .getLayoutParams(); //
- View item = mItemViews.get(index); //
- // ：UI getLeft()
- int targetLeftMargin = (int) (item.getLeft() + item.getWidth() / 2.0 - mBgImage
- .getWidth() / 2.0); //
- // ， setLayoutParams(...)
- if (params.leftMargin == targetLeftMargin) {
- return;
- }
- params.leftMargin = targetLeftMargin;
- mBgImage.setLayoutParams(params); //
- }
-
- //
- private void moveImagePosition(int offset) {
- if (null == mBgImage) {
- return;
- }
- LayoutParams params = (RelativeLayout.LayoutParams) mBgImage
- .getLayoutParams(); //
- params.leftMargin += offset;
- mBgImage.setLayoutParams(params); //
- }
-
- /*
- * ， 。
- * arg0： 。 0， 。
- * arg1： ，[0, 1)。（ ）
- * arg2： 。（ ）
- */
- @Override
- public void onPageScrolled(int position, float positionOffset,
- int positionOffsetPixels) {
- // ， positionOffsetPixels ：
- // 1）position， ，
- // 2）positionOffset， 0.0， float
- // 3）positionOffsetPixels， 0，int ^^
- if (positionOffsetPixels == 0) {
- setImagePosition(position);
- prevOffset = -1;
- isTitleClicked = false;
- return;
- }
- // ，
- if (prevOffset == -1) {
- prevOffset = positionOffsetPixels;
- return;
- }
- int pageOffset = positionOffsetPixels - prevOffset; //
- prevOffset = positionOffsetPixels;
- if (null != mBgImage) {
- try {
- if (pageOffset 0) { // ->
- int prevIndex, nextIndex;
- if (isTitleClicked) {
- prevIndex = previousIndex;
- nextIndex = currentIndex;
- } else {
- prevIndex = currentIndex;
- nextIndex = currentIndex - 1;
- }
- //
- int itemDistance = mItemViews.get(prevIndex).getLeft()
- - mItemViews.get(nextIndex).getLeft();
- //
- int p_w_picpathOffset = pageOffset * itemDistance
- / mViewPager.getWidth();
- //
- moveImagePosition(p_w_picpathOffset);
- } else if (pageOffset > 0) { // ->
- int prevIndex, nextIndex;
- if (isTitleClicked) {
- prevIndex = previousIndex;
- nextIndex = currentIndex;
- } else {
- prevIndex = currentIndex;
- nextIndex = currentIndex + 1;
- }
- //
- int itemDistance = mItemViews.get(nextIndex).getLeft()
- - mItemViews.get(prevIndex).getLeft();
- //
- int p_w_picpathOffset = pageOffset * itemDistance
- / mViewPager.getWidth();
- //
- moveImagePosition(p_w_picpathOffset);
- }
- } catch (IndexOutOfBoundsException e) {
- // ==， T^T
- setImagePosition(currentIndex);
- isTitleClicked = false;
- }
- }
- if (null != mOnPageChangeListener) {
- mOnPageChangeListener.onPageScrolled(position, positionOffset,
- positionOffsetPixels);
- }
- }
-
- /*
- * 。 。
- * arg0：
- */
- @Override
- public void onPageSelected(int position) {
- if (null != mOnPageChangeListener) {
- mOnPageChangeListener.onPageSelected(position);
- }
- }
-
- /*
- * 。 、 （ ）、 / 。
- * arg0： 。SCROLL_STATE_DRAGGING、SCROLL_STATE_SETTLING、SCROLL_STATE_IDLE
- */
- @Override
- public void onPageScrollStateChanged(int state) {
- if (state == ViewPager.SCROLL_STATE_DRAGGING) { //
- isTitleClicked = false;
- }
- if (null != mOnPageChangeListener) {
- mOnPageChangeListener.onPageScrollStateChanged(state);
- }
- }
-
- // ViewPager
- private class MPagerAdapter extends PagerAdapter {
-
- /*
- * 。 ， finishUpdate() 。
- * arg0： ， 。
- * arg1：
- * arg2： instantiateItem(View, int)
- */
- @Override
- public void destroyItem(View arg0, int arg1, Object arg2) {
- ((ViewPager) arg0).removeView(mPageViews.get(arg1));
- }
-
- /*
- * 。 ， 。
- * arg0： ，
- */
- @Override
- public void finishUpdate(View arg0) {
- }
-
- //
- @Override
- public int getCount() {
- return mPageViews.size();
- }
-
- /*
- * 。 ， finishUpdate() 。
- * arg0： ， 。
- * arg1：
- * Object： 。 View， 。
- */
- @Override
- public Object instantiateItem(View arg0, int arg1) {
- ((ViewPager) arg0).addView(mPageViews.get(arg1), 0);
- return mPageViews.get(arg1);
- }
-
- //
- @Override
- public boolean isViewFromObject(View arg0, Object arg1) {
- return arg0 == (arg1);
- }
-
- //
- @Override
- public void restoreState(Parcelable arg0, ClassLoader arg1) {
- }
-
- // ，
- @Override
- public Parcelable saveState() {
- return null;
- }
-
- /*
- *
- * arg0： ，
- */
- @Override
- public void startUpdate(View arg0) {
- }
- }
-
- @Override
- public void onClick(View v) {
- int size = mItemViews.size(); //
- for (int i = 0; i
- if (mItemViews.get(i).getId() == v.getId()) {
- isTitleClicked = true;
- setCurrentPage(i, true);
- break;
- }
- }
- }
-
- //
- public ArrayList
getItemViews() {
- return mItemViews;
- }
-
- //
- public ArrayList
getPageViews() {
- return mPageViews;
- }
-
- //
- public void setOnPageChangeListener(OnPageChangeListener listener) {
- mOnPageChangeListener = listener;
- }
-
- }
Android
カスタムコンポーネント(2)
添付ファイルの工事、(二)を参照してください.