自定义View之自定义设置界面栏位

自定义View之自定义设置界面栏位

在app的应用设置中经常会有如下所示的设置样式，正好学习自定义view，下面我们就先实现一个；

效果

1.开启新的自定义view

public class ComboBox extends RelativeLayout{

    public ComboBox(Context context) {
        super(context);
    }

    public ComboBox(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public ComboBox(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
  }

2.设置到xml中

其实这个时候运行项目就可以显示出自定义view了，但是我没什么都没有设置，所以只是一片空白；

3.自定义view布局

• 自定义view布局

• 引用布局

  private void initUI(Context context) {
      LayoutInflater.from(context).inflate(R.layout.layout_combobox,this,true);
      tvTitle= (TextView) findViewById(R.id.tv_title_cb);
      tvContent= (TextView) findViewById(R.id.tv_content_cb);
      cbCombo= (CheckBox) findViewById(R.id.cb_select_cb);
      llLeft= (LinearLayout) findViewById(R.id.ll_left);
  }
  

  当然initUI方法还需要加入到构造方法中，不然就没效果了。

  效果

4.自定义属性

通过以上的操作我们就可以得到一个像模像样的设置栏位了，当然，所有的属性我们都需要在java文件中修改，这不是我们想要的，我们如何才能向正常的控件一样在xml中定义各种属性呢？这就需要用的自定义属性了。

• 定义属性

  1.首先我们需要新建一个文件attrs.xml,如下图所示：

  attrs.xml

  2.然后具体定义属性内容：

• 引用属性

  private String title,checkContent,unCheckContent;
  private boolean isChecked;
  private TextView tvTitle,tvContent;
  private CheckBox cbCombo;
  
  private void initAttr(Context context, AttributeSet attrs) {
      TypedArray ta=context.obtainStyledAttributes(attrs,
              R.styleable.ComboBox);
  
      title=ta.getString(R.styleable.ComboBox_title);
      checkContent=ta.getString(R.styleable.ComboBox_checkedContent);
      unCheckContent=ta.getString(R.styleable.ComboBox_unCheckContent);
      isChecked=ta.getBoolean(R.styleable.ComboBox_ischeck,false);
  
      //获取完值之后我们需要调用recycle()方法来避免重新创建的时候的错误
      ta.recycle();
  }
  

  我们通过获取TyoedArray对象来获取到我们自定义的属性，获取到属性之后在赋值到我们定义的内部属性里，这样就可以调用了

  tvTitle.setText(title);
  tvContent.setText(isChecked?checkContent:unCheckContent);
  cbCombo.setChecked(isChecked);
  cbCombo.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
      @Override
      public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
          tvContent.setText(isChecked?checkContent:unCheckContent);
      }
  });
  

• 使用属性

  这样我们可以在xml中定义我们的属性了，效果如下：

  attr2
  attr3

5.自定义方法

能够在xml中设置属性还不够，我们还要在java代码中设置属性，接下来构造对应的设置方法

• 设置基本属性getter&setter方法

  /**
       * 设置标题
       * @param title
       */
      public void setTitle(String title){
          tvTitle.setText(title);
      }
  
      /**
       * 设置勾选显示文本
       * @param checkContent
       */
      public void setCheckContent(String checkContent) {
          this.checkContent = checkContent;
      }
  
      /**
       * 设置未勾选显示文本
       * @param unCheckContent
       */
      public void setUnCheckContent(String unCheckContent) {
          this.unCheckContent = unCheckContent;
      }
  
      /**
       * 设置是否勾选
       * @param checked
       */
      public void setChecked(boolean checked){
          cbCombo.setChecked(checked);
      }
  
      /**
       * 返回是否勾选
       * @return boolean
       */
      public boolean isChecked(){
          return cbCombo.isChecked();
      }
  

• 设置点击事件

  当然还有自定义view的点击事件，我得需求是除开CheckBox之外的部分响应，也就是上面对上面初始化的左边的LinearLayout进行点击事件设置

  /**
   * 设置点击事件
   * @param listener 对左侧文本LinearLayout设置点击事件
   */
  public void setLeftContainerClickListener(OnClickListener listener){
      this.setOnClickListener(listener);
  }
  

6.正式使用

public class MainActivity extends AppCompatActivity {
    private ComboBox cbTest;
    private String TAG=this.getClass().getSimpleName();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        cbTest = (ComboBox) findViewById(R.id.cb_test);
        cbTest.setLeftContainerClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (cbTest.isChecked()){
                    Logger.t(TAG).i("设置勾选为TRUE");
                    cbTest.setChecked(false);
                }else {
                    cbTest.setChecked(true);
                }
            }
        });
    }
}

这样就获得了一个简单的自定义view！

7.源码传送门

我是一只咸鱼，不想承认，也不能否认，不要同情我笨，又夸我天真，还梦想着翻身...