[关闭]
@linux1s1s 2016-09-26T09:56:57.000000Z 字数 6881 阅读 1567

Android 自定义View 实例

AndroidView


Android 相关自定义View基本知识可以参考 Android View 自定义属性, 本篇博客博主将和大家一起实践Android自定义View,我们知道,在应用中最常见的就是TitleBar,他们形式上保持一致,一般均是左边回退按钮,中间说明文本,右边功能按钮。所以很适合抽取作为自定义View模板,废话少说,直接上干货。

自定义View-attrs

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <resources>
  3. <declare-styleable name="TitleBarCustom">
  4. <attr name="center_text" format="string"/>
  5. <attr name="center_size" format="dimension"/>
  6. <attr name="center_color" format="color"/>
  7. <attr name="center_ground" format="reference|color"/>
  8. <attr name="left_text" format="string"/>
  9. <attr name="left_size" format="dimension"/>
  10. <attr name="left_color" format="color"/>
  11. <attr name="left_ground" format="reference|color"/>
  12. <attr name="right_text" format="string"/>
  13. <attr name="right_size" format="dimension"/>
  14. <attr name="right_color" format="color"/>
  15. <attr name="right_ground" format="reference|color"/>
  16. </declare-styleable>
  17. </resources>

自定义View类

  1. import android.content.Context;
  2. import android.content.res.TypedArray;
  3. import android.graphics.drawable.Drawable;
  4. import android.util.AttributeSet;
  5. import android.view.View;
  6. import android.widget.Button;
  7. import android.widget.LinearLayout;
  8. import android.widget.RelativeLayout;
  9. import android.widget.TextView;
  10. public class TitleBar extends RelativeLayout
  11. {
  12. private Button mRightButton, mLeftButton;
  13. private TextView mCenterTextView;
  14. private int mCenterColor, mRightColor, mLeftColor;
  15. private Drawable mCenterBackground, mRightBackground, mLeftBackground;
  16. private float mCenterSize, mRightSize, mLeftSize;
  17. private String mCenterText, mRightText, mLeftText;
  18. public void setOnTitleBarClickListener(OnTitleBarClickListener mOnTitleBarClickListener)
  19. {
  20. this.mOnTitleBarClickListener = mOnTitleBarClickListener;
  21. }
  22. private OnTitleBarClickListener mOnTitleBarClickListener;
  23. public TitleBar(Context context, AttributeSet attrs)
  24. {
  25. super(context, attrs);
  26. final TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.TitleBarCustom);
  27. final int N = a.getIndexCount();
  28. for (int i = 0; i < N; i++)
  29. {
  30. int attr = a.getIndex(i);
  31. switch (attr)
  32. {
  33. case R.styleable.TitleBarCustom_center_color:
  34. mCenterColor = a.getColor(attr, -1);
  35. break;
  36. case R.styleable.TitleBarCustom_center_size:
  37. mCenterSize = a.getDimension(attr, 0);
  38. break;
  39. case R.styleable.TitleBarCustom_center_text:
  40. mCenterText = a.getString(attr);
  41. break;
  42. case R.styleable.TitleBarCustom_center_ground:
  43. mCenterBackground = a.getDrawable(attr);
  44. break;
  45. case R.styleable.TitleBarCustom_left_color:
  46. mLeftColor = a.getColor(attr, -1);
  47. break;
  48. case R.styleable.TitleBarCustom_left_size:
  49. mLeftSize = a.getDimension(attr, 0);
  50. break;
  51. case R.styleable.TitleBarCustom_left_text:
  52. mLeftText = a.getString(attr);
  53. break;
  54. case R.styleable.TitleBarCustom_left_ground:
  55. mLeftBackground = a.getDrawable(attr);
  56. break;
  57. case R.styleable.TitleBarCustom_right_color:
  58. mRightColor = a.getColor(attr, -1);
  59. break;
  60. case R.styleable.TitleBarCustom_right_size:
  61. mRightSize = a.getDimension(attr, 0);
  62. break;
  63. case R.styleable.TitleBarCustom_right_text:
  64. mRightText = a.getString(attr);
  65. break;
  66. case R.styleable.TitleBarCustom_right_ground:
  67. mRightBackground = a.getDrawable(attr);
  68. break;
  69. }
  70. }
  71. mRightButton = new Button(context);
  72. mRightButton.setText(mRightText);
  73. mRightButton.setTextSize(mRightSize);
  74. mRightButton.setTextColor(mRightColor);
  75. mRightButton.setBackgroundDrawable(mRightBackground);
  76. RelativeLayout.LayoutParams rightParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
  77. rightParams.addRule(ALIGN_PARENT_RIGHT, TRUE);
  78. rightParams.addRule(CENTER_VERTICAL, TRUE);
  79. rightParams.setMargins(0, 0, 10, 0);
  80. mRightButton.setLayoutParams(rightParams);
  81. addView(mRightButton);
  82. mRightButton.setOnClickListener(new OnClickListener()
  83. {
  84. @Override
  85. public void onClick(View v)
  86. {
  87. if (mOnTitleBarClickListener != null)
  88. {
  89. mOnTitleBarClickListener.rightButtonClick();
  90. }
  91. }
  92. });
  93. mLeftButton = new Button(context);
  94. mLeftButton.setText(mLeftText);
  95. mLeftButton.setTextSize(mLeftSize);
  96. mLeftButton.setTextColor(mLeftColor);
  97. mLeftButton.setBackgroundDrawable(mLeftBackground);
  98. RelativeLayout.LayoutParams leftParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
  99. leftParams.addRule(ALIGN_PARENT_LEFT, TRUE);
  100. leftParams.addRule(CENTER_VERTICAL, TRUE);
  101. leftParams.setMargins(10, 0, 0, 0);
  102. mLeftButton.setLayoutParams(leftParams);
  103. addView(mLeftButton);
  104. mLeftButton.setOnClickListener(new OnClickListener()
  105. {
  106. @Override
  107. public void onClick(View v)
  108. {
  109. if (mOnTitleBarClickListener != null)
  110. {
  111. mOnTitleBarClickListener.leftButtonClick();
  112. }
  113. }
  114. });
  115. mCenterTextView = new TextView(context);
  116. mCenterTextView.setText(mCenterText);
  117. mCenterTextView.setTextSize(mCenterSize);
  118. mCenterTextView.setTextColor(mCenterColor);
  119. mCenterTextView.setBackgroundDrawable(mCenterBackground);
  120. RelativeLayout.LayoutParams centerParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
  121. centerParams.addRule(CENTER_IN_PARENT, TRUE);
  122. leftParams.setMargins(10, 0, 10, 0);
  123. mCenterTextView.setLayoutParams(centerParams);
  124. addView(mCenterTextView);
  125. a.recycle();
  126. }
  127. @SuppressWarnings("unused")
  128. public void setRightButtonVisiablity(boolean isVisiable)
  129. {
  130. if (mRightButton == null) return;
  131. if (isVisiable)
  132. {
  133. mRightButton.setVisibility(View.VISIBLE);
  134. }
  135. else
  136. {
  137. mRightButton.setVisibility(View.GONE);
  138. }
  139. }
  140. @SuppressWarnings("unused")
  141. public void setLeftButtonVisiablity(boolean isVisiable)
  142. {
  143. if (mLeftButton == null) return;
  144. if (isVisiable)
  145. {
  146. mLeftButton.setVisibility(View.VISIBLE);
  147. }
  148. else
  149. {
  150. mLeftButton.setVisibility(View.GONE);
  151. }
  152. }
  153. @SuppressWarnings("unused")
  154. public void setCenterTextVisiablity(boolean isVisiable)
  155. {
  156. if (mCenterTextView == null) return;
  157. if (isVisiable)
  158. {
  159. mCenterTextView.setVisibility(View.VISIBLE);
  160. }
  161. else
  162. {
  163. mCenterTextView.setVisibility(View.GONE);
  164. }
  165. }
  166. public interface OnTitleBarClickListener
  167. {
  168. void leftButtonClick();
  169. void rightButtonClick();
  170. }
  171. }

使用自定义View

首先在UI中定义

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. xmlns:linroid="http://schemas.android.com/apk/res-auto"
  4. android:orientation="vertical"
  5. android:layout_width="match_parent"
  6. android:layout_height="match_parent">
  7. <studio.linroid.com.tasktest.TitleBar
  8. android:layout_width="match_parent"
  9. android:layout_height="60dp"
  10. linroid:center_color="#FF0000"
  11. linroid:center_text="This is Title"
  12. linroid:center_size="12dp"
  13. linroid:center_ground="#00FF00"
  14. linroid:right_color="#00FF00"
  15. linroid:right_text="Click"
  16. linroid:right_size="10dp"
  17. linroid:right_ground="#0000FF"
  18. linroid:left_color="#0000FF"
  19. linroid:left_text="Back"
  20. linroid:left_size="10dp"
  21. linroid:left_ground="#FF0000"
  22. android:id="@+id/title_bar" />
  23. </LinearLayout>

然后在代码中使用

  1. public class SixActivity extends Activity
  2. {
  3. @Override
  4. protected void onCreate(Bundle savedInstanceState)
  5. {
  6. super.onCreate(savedInstanceState);
  7. setContentView(R.layout.activity_title);
  8. initView();
  9. }
  10. private void initView()
  11. {
  12. final TitleBar titleBar = (TitleBar) findViewById(R.id.title_bar);
  13. if (titleBar != null)
  14. {
  15. titleBar.setOnTitleBarClickListener(new OnTitleBarClickListener()
  16. {
  17. @Override
  18. public void leftButtonClick()
  19. {
  20. Toast.makeText(SixActivity.this, "Left button click!", Toast.LENGTH_LONG).show();
  21. }
  22. @Override
  23. public void rightButtonClick()
  24. {
  25. Toast.makeText(SixActivity.this, "Right button click!", Toast.LENGTH_LONG).show();
  26. }
  27. });
  28. }
  29. }
  30. }

这样就完成了整个TitleBar的自定义View,虽然很粗糙,但是基本的模型已经出来了,这是个典型的组合自定义型View的例子,其他自定义型View后续会更新。

添加新批注
在作者公开此批注前,只有你和作者可见。
回复批注