Android 一些常用自定义控件

最新推荐文章于 2024-06-03 18:31:31 发布
最新推荐文章于 2024-06-03 18:31:31 发布
阅读量600 收藏 4
点赞数
分类专栏： Android 框架 Android 自定义控件 文章标签： Android 自定义控件 自定义布局
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u012862619/article/details/79230557
版权

Widgets

widget

widget是一个Android自定义控件库。包含多种常用控件。

项目地址

Github地址：Widget

效果展示

控件展示较多，更新也较频繁，不方便录制gif图片，请下载demo体验

基本使用

  • 引入jitpack

    由于引用了PhotoView，而其中使用了jitpack中的库，所以需要在项目根目录下的build.gradle中引入jitpack

    allprojects {
repositories {
  // ...
  maven { url "https://jitpack.io" }
}
}

  • 添加依赖

    在项目主模块中添加如下依赖

    dependencies {
compile 'com.yhy.widget:view-core:latestVersion'
}

控件总览

简要罗列各种控件

  • core控件

核心控件，即各种独立使用的控件

名称描述
PreImgActivity点击图片查看大图控件
AdvView滚动广告轮播控件
CheckedTextView可选中的TextView
ExpandTextView可展开收起的TextView
SquareImageView正方形ImageView，右上角可设置按钮及点击事件
CircleImageView圆形图片
RoundImageView圆角图片
HackyViewPager多点触摸滑动时防止内存溢出的ViewPager
PickerView上下滚动数据选取控件
RecyclerScrollView用来嵌套RecyclerView的ScrollView
RvDividerRecyclerView的分割线
SettingsItemView常用设置布局中的条目控件
TitleBar常用标题栏控件
SwitchButton开关控件
  • layout控件

布局控件

名称描述
CheckedFrameLayout可选中的FrameLayout
CheckedLayout可选中的ViewGroup
CheckedLinearLayout可选中的LinearLayout
CheckedRelativeLayout可选中的RelativeLayout
FlowLayout流式布局，标签流式布局的基类
TagFlowLayout标签流式布局
SlideLayout侧滑布局
StatusLayout状态管理页面布局【加载中，空数据，错误，成功】

使用说明

core控件

  • PreImgActivity

    点击查看大图功能

    • Application中初始化

    需要在Application中初始化，并通过ImgPreHelper设置图片加载器、图片下载器等相关配置

    ImgPreHelper.getInstance().init(this).setLoader(new ImgPreHelper.ImgLoader() {
    @Override
    public <T> void load(ImageView iv, T model, ProgressBar pbLoading) {
        Glide.with(iv.getContext()).load(model).into(iv);
    }
}).setOnDownloadListener(new ImgPreHelper.OnDownloadListener() {
    @Override
    public void onProgress(float progress, long current, long total) {
        Log.i("ImgDownloader", "下载进度：" + (progress * 100F) + "%，总大小：" + total + " bytes, 已下载：" + current + " bytes.");
    }

    @Override
    public void onSuccess(File img, String msg) {
        ToastUtils.shortT(msg);
    }

    @Override
    public void onError(String error) {
        ToastUtils.shortT(error);
    }
});
    • 设置ImgPreCfg参数

    多张图

    // 多张图
List<String> urlList = new ArrayList<>();
urlList.add("http://img.youguoquan.com/uploads/magazine/content/a811c176420a20f8e035fc3679f19a10_magazine_web_m.jpg");
urlList.add("http://img.youguoquan.com/uploads/magazine/content/7b2a0fdbb23c9e63586b7ff6798dbebb_magazine_web_m.jpg");
urlList.add("http://img.youguoquan.com/uploads/magazine/content/c9c47160b46fceab5afd24dea7f216e6_magazine_web_m.jpg");
urlList.add("http://img.youguoquan.com/uploads/magazine/content/fd986a6e0d5fa3a4485e5ce28f40b2ad_magazine_web_m.jpg");
// 参数1为点击的ImageView；参数3为当前要预览的图片索引。
ImgPreCfg cfg = new ImgPreCfg(iv, urlList, 1);

    一张图

    // 参数1为点击的ImageView；参数2为当前要预览的图片地址。
ImgPreCfg cfg = new ImgPreCfg(iv, url);

// x, y, width, height 分别为图片x, y坐标和宽高度。
ImgPreCfg cfg = new ImgPreCfg(x, y, width, height, url);
    • 开始预览
    PreImgActivity.preview(this, cfg);

  • AdvView

    广告轮播展示栏

    • 布局文件
    <com.yhy.widget.core.adv.AdvView
  android:id="@+id/av_view_multiple"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginTop="48dp"
  android:background="#ac0"
  app:av_anim_duration="1000"
  app:av_interval="4000" />
    • 获取控件
    AdvView avMultiple = findViewById(R.id.av_view_multiple);
    • 设置数据和事件

    设置数据

    List<String> mItems = new ArrayList<>();
mItems.add("这是第1个");
mItems.add("这是第2个");
mItems.add("这是很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长的第3个");
mItems.add("这是第4个");
mItems.add("这是第5个");
mItems.add("这是第6个");
mItems.add("这是第7个");

// 第3个参数为每页展示广告条数，默认为1，即单条展示
SimpleAdvAdapter<String> avAdapter = new SimpleAdvAdapter<String>(this, mItems, 3) {
  @Override
  protected View getItemView(int position, String data) {
    TextView tv = new TextView(mCtx);
    tv.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
    tv.setGravity(Gravity.LEFT | Gravity.CENTER_VERTICAL);
    tv.setText(data);
    tv.setTextColor(Color.DKGRAY);
    tv.setTextSize(14);
    tv.setSingleLine();
    tv.setEllipsize(TextUtils.TruncateAt.END);
    return tv;
  }
};

// 设置适配器到AdvView
avMultiple.setAdapter(avAdapter);

    设置条目点击事件

    avAdapter.setOnItemClickListener(new SimpleAdvAdapter.OnItemClickListener<String>() {
  @Override
  public void onItemClick(SimpleAdvAdapter adapter, int position, String data) {
    toast("position = " + position + ", " + data);
  }
});
    • 自定义属性
    属性说明默认值
    av_interval动画定时，单位ms3000
    av_anim_duration动画执行时间，单位ms800
    av_anim_in入场动画资源R.anim.adv_in
    av_anim_out出场动画资源R.anim.adv_out

  • CheckedTextView

    可选中的TextView

    • 布局文件

    背景选择器bg_checked_ctv_selector

    <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:state_checked="true">
    <shape android:shape="rectangle">
      <solid android:color="@color/colorAccent" />
      <corners android:radius="4dp" />
    </shape>
  </item>
  <item>
    <shape android:shape="rectangle">
      <solid android:color="#666" />
      <corners android:radius="4dp" />
    </shape>
  </item>
</selector>

    布局

    <com.yhy.widget.core.checked.CheckedTextView
  android:id="@+id/ctv_def"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:background="@drawable/bg_checked_ctv_selector"
  android:padding="8dp"
  android:text="阻止了Click和LongClick事件"
  android:textColor="#fff"
  android:textSize="14sp" />
  <!-- 默认阻止了click和longClick事件，如果需要添加这些事件，请添加属性：app:ctv_prevent="false" -->
    • 获取控件
    CheckedTextView ctvDef = findViewById(R.id.ctv_def);
    • 设置事件
    ctvDef.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View v) {
    toast("我的click被阻止了");
  }
});

ctvDef.setOnLongClickListener(new View.OnLongClickListener() {
  @Override
  public boolean onLongClick(View v) {
    toast("我的longClick被阻止了");
    return true;
  }
});

ctvDef.setOnCheckedChangeListener(new CheckedTextView.OnCheckedChangeListener() {
  @Override
  public void onChanged(CheckedTextView ctv, boolean isChecked) {
    toast("isChecked = " + isChecked);
  }
});
    • 自定义属性
    属性说明默认值
    ctv_prevent是否阻止click和longClick事件true

  • ExpandTextView

    可展开收起的TextView

    • 布局文件
    <com.yhy.widget.core.exptext.ExpandTextView
  android:id="@+id/etv_content"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="#fff"
  android:orientation="vertical"
  app:etv_anim_alpha_start="0.2"
  app:etv_anim_duration="800"
  app:etv_max_collapsed_lines="4">

  <!-- 显示文本内容的TextView -->
  <TextView
    android:id="@+id/tv_content"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    android:layout_marginTop="8dp"
    android:ellipsize="end"
    android:textColor="#666666"
    android:textSize="16sp"/>

  <!--展开和收起的点击按钮-->
  <TextView
    android:id="@+id/tv_expand"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end|bottom"
    android:padding="16dp"
    android:text="窝草"/>
</com.yhy.widget.core.exptext.ExpandTextView>
    • 获取控件
    ExpandTextView etvContent = findViewById(R.id.etv_content);
// 配置内容控件和按钮控件
etvContent.mapViewId(R.id.tv_content, R.id.tv_expand);
    • 设置数据
    etvContent.setText("哈哈哈哈哈哈啊哈哈哈哈");
    • 设置事件
    etvContent.setOnExpandStateChangeListener(new ExpandTextView.OnExpandStateChangeListener() {
  @Override
  public void onExpandStateChanged(TextView textView, boolean isExpanded) {
    toast(isExpanded ? "展开了" : "收起了");
  }
});
    • 自定义属性
    属性说明默认值
    etv_max_collapsed_lines收缩时显示的最大行数2
    etv_anim_duration动画执行时间，单位ms400m
    etv_anim_alpha_start透明度动画开始时的值0.6

  • SquareImageView

    正方形ImageView

    • 布局文件
    <com.yhy.widget.core.img.SquareImageView 
  android:id="@+id/siv_test"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  app:siv_btn_color="#f20"
  app:siv_btn_img="@drawable/ic_delete_white" />
    • 获取控件
    SquareImageView sivTest = findViewById(R.id.siv_test);
    • 设置数据
    Glide.with(ctx).load(url).into(sivTest);
    • 设置事件
    sivTest.setOnBtnClickListener(new SquareImageView.OnBtnClickListener() {
  @Override
  public void onClick(SquareImageView siv) {
    Toast.makeText(SquareIVActivity.this, "删除第" + position + "张图片", Toast.LENGTH_SHORT).show();
  }
});
    • 自定义属性
    属性说明默认值
    siv_btn_img右上角按钮图片无
    siv_btn_size右上角按钮大小，单位dp控件大小的1/6
    siv_btn_color右上角按钮颜色透明
    siv_btn_padding右上角按钮内边距，单位dp2

  • CircleImageView

    圆形图片

    • 布局文件
    <com.yhy.widget.core.img.corner.CircleImageView
  android:id="@+id/civ_test"
  android:layout_width="100dp"
  android:layout_height="100dp"
  android:src="@mipmap/ic_avatar"
  app:civ_border_color="#f40"
  app:civ_border_overlay="true"
  app:civ_border_width="2dp"
  app:civ_fill_color="#0f0"/>
    • 获取控件
    CircleImageView civTest = findViewById(R.id.civ_test);
    • 设置数据
    Glide.with(ctx).load(url).into(civTest);
    • 自定义属性
    属性说明默认值
    civ_border_width边框宽度，单位dp0
    civ_border_color边框颜色#000000
    civ_border_overlay是否悬浮边框false
    civ_fill_color填充颜色透明

  • RoundImageView

    圆角图片

    • 布局文件
    <com.yhy.widget.core.img.corner.RoundImageView
  android:id="@+id/riv_test"
  android:layout_width="100dp"
  android:layout_height="100dp"
  android:layout_marginTop="24dp"
  android:src="@mipmap/ic_avatar"
  app:civ_border_color="#f40"
  app:civ_border_overlay="true"
  app:civ_border_width="2dp"
  app:civ_fill_color="#0f0"
  app:riv_radius="6dp"/>
    • 获取控件
    CircleImageView rivTest = findViewById(R.id.riv_test);
    • 设置数据
    Glide.with(ctx).load(url).into(rivTest);
    • 自定义属性
    属性说明默认值
    civ_border_width边框宽度，单位dp0
    civ_border_color边框颜色#000000
    civ_border_overlay是否悬浮边框false
    civ_fill_color填充颜色透明
    riv_radius圆角半径，单位dp0

  • HackyViewPager

    多点触摸滑动时防止内存溢出的ViewPager

    当成普通ViewPager使用即可

  • PickerView

    上下滚动数据选取控件

    • 布局文件
    <com.yhy.widget.core.picker.PickerView
  android:id="@+id/pv_test"
  android:layout_width="match_parent"
  android:layout_height="200dp"
  app:pv_text_color="#f20"/>
    • 获取控件
    // // 泛型表示该控件中数据源的数据类型
PickerView<TestEntity> pvText = findViewById(R.id.pv_test);
    • 设置数据及事件
    List<TestEntity> testList = new ArrayList<>();
for (int i = 1; i <= 40; i++) {
  testList.add(new TestEntity(i, "Data " + i));
}

pvTest.setData(testList, new PickerView.ItemProvider<TestEntity>() {
  @Override
  public String getItem(TestEntity data, int position) {
    return data.name;
  }
}).setOnSelectListener(new PickerView.OnSelectListener<TestEntity>() {
  @Override
  public void onSelect(TestEntity data) {
    toast(data.name);
  }
});
    • 自定义属性
    属性说明默认值
    pv_max_text_size字体最大尺寸，单位dp20
    pv_min_text_size字体最小尺寸，单位dp14
    pv_text_color字体颜色#e84c3d

  • RecyclerScrollView

    用来嵌套RecyclerView的ScrollView

    当成普通ScrollView使用即可

    • 设置滚动监听事件
    rsvTest.setOnScrollListener(new OnScrollListener() {
  @Override
  public void onScroll(RecyclerScrollView view, int x, int y, int oldX, int oldY){
    toast("当前滚动条y坐标为：" + y);
  }
});

  • RvDivider

    RecyclerView的分割线

    目前只针对LinearLayoutManager和GridLayoutManager两种布局

    注意：一定要在设置适配器后添加分割线

    • 创建分割线
    RvDivider mDivider = new RvDivider.Builder(this)
  .widthDp(30)
  .color(getResources().getColor(R.color.colorPrimary))
  .type(RvDivider.DividerType.TYPE_WITH_START_END)
  .build();
    • LinearLayoutManager
    rvContent.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false));
// 先设置适配器，再添加分割线
rvContent.addItemDecoration(mDivider);
    • GridLayoutManager
    rvContent.setLayoutManager(new GridLayoutManager(this, 4));
// 先设置适配器，再添加分割线
rvContent.addItemDecoration(mDivider);

  • SettingsItemView

    常用设置布局中的条目控件

    • 布局文件
    <com.yhy.widget.core.settings.SettingsItemView
  android:id="@+id/siv_test"
  android:layout_width="match_parent"
  android:layout_height="48dp"
  android:background="#fff"
  android:paddingLeft="8dp"
  android:paddingRight="8dp"
  app:siv_name="设置1"
  app:siv_text="值1" />
    • 获取控件
    SettingsItemView sivTest = findViewById(R.id.siv_test);
    • 设置数据
    sivTest.setName("左边文字").setText("右边文字");
// ... 还有设置图标之类的各种方法，如下
sivTest.setIcon(mIcon)
  .showIcon(mShowIcon)
  .setArrow(mArrow)
  .showArrow(mShowArrow)
  .setName(mName)
  .setNameWidth(mNameWidth)
  .setNameColor(mNameColor)
  .setNameSize(mNameSize)
  .setText(mText)
  .setHint(mHint)
  .setEditable(mEditable)
  .setTextColor(mTextColor)
  .setTextSize(mTextSize)
  .onSwitch(mSwitchOn)
  .showSwitch(mShowSwitch)
  .setNameGravity(mNameGravity)
  .setTextGravity(mTextGravity)
  .setCursorDrawableRes(mCursorDrawableRes);

// 如果有开关控件，还需要设置开关监听事件
sivTest.setOnSwitchStateChangeListener(new SettingsItemView.OnSwitchStateChangeListener() {
  @Override
  public void onStateChanged(SettingsItemView siv, SwitchButton sb, boolean isOn) {
    toast(siv.getName() + " :: isOn = " + isOn);
  }
});
    • 自定义属性
    属性说明默认值
    siv_icon左边图标无
    siv_show_icon是否显示左边图标false
    siv_arrow右边箭头无
    siv_show_arrow是否显示右边箭头false
    siv_name左边文本空
    siv_name_width左边文本宽度，单位dp自适应
    siv_name_gravity左边文本对其方式【leftcenter
    siv_name_size左边文本大小，单位sp14
    siv_name_color左边文本颜色#000000
    siv_text右边内容空
    siv_text_gravity右边内容对齐方式【leftcenter
    siv_hint右边提示文本空
    siv_text_size右边字体大小，单位sp14
    siv_text_color右边字体颜色#000000
    siv_switch_on是否打开开关false
    siv_switch_width开关控件宽度，单位dp48
    siv_switch_height开关控件高度，单位dp28
    siv_show_switch是否显示开关控件false
    siv_editable是否可编辑false
    siv_cursor_drawable光标颜色资源系统默认

  • TitleBar

    常用标题栏控件

    • 布局文件
    <com.yhy.widget.core.title.TitleBar
  android:id="@+id/tb_test"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="#7ad"
  android:elevation="8dp"
  app:tb_title="测试标题" />
    • 获取控件
    TitleBar tbTest = findViewById(R.id.tb_test);
    • 设置数据及事件
    tbTest.setTitle("标题");

// 事件，该监听器不是接口或者抽象类，只需要重写对应的方法即可
tbTest2.setOnTitleBarListener(new TitleBar.OnTitleBarListener() {
  @Override
  public void titleClick(View view) {
    toast("点击了标题");
  }

  @Override
  public void leftIconClick(View view) {
    toast("返回");
    finish();
  }

  @Override
  public void leftTextClick(View view) {
    toast("左边文本");
  }

  @Override
  public void rightIconClick(View view) {
    toast("右边图标");
  }

  @Override
  public void rightTextClick(View view) {
    toast("右边文本");
  }
});
}
    • 自定义属性
    属性说明默认值
    tb_title标题文本空
    tb_left_text左边文本空
    tb_right_text右边文本空
    tb_left_icon左边图标无
    tb_right_icon右边图标无
    tb_font_color字体颜色#ffffff

  • SwitchButton

    常用开关控件

    • 布局文件
    <com.yhy.widget.core.toggle.SwitchButton
  android:id="@+id/switch_button"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_marginTop="10dp"/>
    • 获取控件
    SwitchButton switchButton = findViewById(R.id.switch_button);
    • 设置数据事件
    switchButton.onOrOff(true);
switchButton.isOn();
switchButton.toggle();     //switch state
switchButton.toggle(false);//switch without animation
switchButton.setShadowEffect(true);//disable shadow effect
switchButton.setEnabled(true);//disable button
switchButton.setEnableEffect(false);//disable the switch animation

switchButton.setOnStateChangeListener(new SwitchButton.OnStateChangeListener() {
  @Override
  public void onCheckedChanged(SwitchButton view, boolean isOn) {
    toast("isOn = " + isOn);
  }
});
    • 自定义属性
    属性说明默认值
    sb_shadow_radius阴影半径，单位dp2.5
    sb_shadow_offset阴影偏移值，单位dp1.5
    sb_shadow_color阴影颜色#33000000
    sb_off_color关闭时颜色#dddddd
    sb_on_color打开时颜色#51d367
    sb_border_width边框宽度，单位dp1
    sb_on_line_color打开状态中短竖线颜色#ffffff
    sb_on_line_width打开状态中短竖线宽度，单位dp1
    sb_off_circle_color关闭状态中圆圈颜色#aaaaaa
    sb_off_circle_width关闭状态中圆圈宽度，单位dp1.5
    sb_off_circle_radius关闭状态中圆圈半径，单位dp4
    sb_on是否打开false
    sb_shadow_effect是否支持阴影效果true
    sb_effect_duration效果显示时间，单位ms300
    sb_button_color按钮颜色#ffffff
    sb_show_indicator是否显示指示器true
    sb_background背景颜色#ffffff
    sb_enable_effect是否开启特效true
layout控件

  • CheckedFrameLayout

    可选中的FrameLayout

    • 布局文件
    <com.yhy.widget.layout.checked.CheckedRelativeLayout
  android:id="@+id/crl_test"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content">

  <TextView
    android:id="@+id/tv_test"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/bg_checked_ctv_selector"
    android:padding="8dp"
    android:text="CheckedRelativeLayout"
    android:textColor="#fff"
    android:textSize="14sp" />

  <TextView
    android:layout_below="@id/tv_test"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="48dp"
    android:background="@drawable/bg_checked_ctv_selector"
    android:padding="8dp"
    android:text="CheckedRelativeLayout"
    android:textColor="#fff"
    android:textSize="14sp" />
</com.yhy.widget.layout.checked.CheckedRelativeLayout>
    • 获取控件
    CheckedRelativeLayout crlTest = $(R.id.crl_test);
CheckedRelativeLayout tvTest = $(R.id.tv_test);
    • 设置事件
    tvTest.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View v) {
    toast("点击了TextView");
  }
});

crlTest.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View v) {
    toast("点击");
  }
});

crlTest.setOnCheckedChangeListener(new CheckedRelativeLayout.OnCheckedChangeListener() {
  @Override
  public void onChanged(CheckedRelativeLayout crl, boolean isChecked) {
    toast("isChecked = " + isChecked);
  }
});

  • CheckedLayout

    可选中的ViewGroup

    用法同CheckedFrameLayout

  • CheckedLinearLayout

    可选中的LinearLayout

    用法同CheckedFrameLayout

  • CheckedRelativeLayout

    可选中的RelativeLayout

    用法同CheckedFrameLayout

  • FlowLayout

    流式布局

    一般不用这个布局，只在定义其他流式布局时使用，继承FlowLayout即可，详情请参照TagFlowLayout源码

    • 布局文件
    <com.yhy.widget.layout.flow.FlowLayout
  android:layout_width="wrap_content"
  android:layout_height="wrap_content">

  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:background="#666"
    android:padding="4dp"
    android:text="哈哈哈哈"
    android:textColor="#fff"
    android:textSize="14sp" />

  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:background="#666"
    android:padding="4dp"
    android:text="呵哈呵"
    android:textColor="#fff"
    android:textSize="14sp" />

  <!-- 多个子控件... -->
</com.yhy.widget.layout.flow.FlowLayout>
    • 自定义属性
    属性说明默认值
    fl_gravity布局对齐方式left

  • TagFlowLayout

    标签流式布局

    继承于FlowLayout

    • 布局文件
    <com.yhy.widget.layout.flow.tag.TagFlowLayout
  android:id="@+id/tfl_def"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />
    • 获取控件
    // 泛型表示该控件中数据源的数据类型
TagFlowLayout<TestEntity> tflDef = findViewById(R.id.tfl_def);
    • 设置数据和事件
    // 模拟数据
List<TestEntity> mTestList = new ArrayList<>();
mTestList.add(new TestEntity(0, "张三张三张三张三张三"));
mTestList.add(new TestEntity(1, "李四"));
mTestList.add(new TestEntity(2, "大胖子"));
mTestList.add(new TestEntity(3, "尼古拉斯"));
mTestList.add(new TestEntity(4, "哈"));
mTestList.add(new TestEntity(5, "大胖子"));
mTestList.add(new TestEntity(6, "尼古拉斯"));
mTestList.add(new TestEntity(7, "哈"));

// 设置适配器
tflDef.setAdapter(new TagFlowAdapter<TestEntity> {
  public Adapter(List<TestEntity> dataList) {
    super(dataList);
  }

  @Override
  public View getView(TagFlowLayout parent, int position, TestEntity data) {
    TextView tv = (TextView) LayoutInflater.from(TagFlowActivity.this).inflate(R.layout.item_tag_flow, null);
    tv.setText(data.name);
    return tv;
  }
});

// 设置条目点击事件
tflDef.setOnCheckChangedListener(new TagFlowLayout.OnCheckChangedListener<TestEntity>() {
  @Override
  public void onChanged(boolean checked, int position, TestEntity data, List<TestEntity> dataList) {
    toast(dataList);
    // 动态添加元素
    mTestList.add(new TestEntity(9, "嘻嘻嘻" + position));
    mAdapter.notifyDataChanged();
  }
});
    • 自定义属性
    属性说明默认值
    fl_gravity布局对齐方式left
    tfl_max_count允许选中的最大数量，-1表示无限-1
    tfl_is_single是否是单选false

  • SlideLayout

    侧滑菜单布局

    • 布局文件
    <com.yhy.widget.layout.slider.SlideLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:id="@+id/sl_slide"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="@mipmap/bg_main"
  app:sl_anim_alpha_color="#f60"
  app:sl_main_alpha_enable="true">

  <LinearLayout
    android:layout_width="240dp"
    android:layout_height="match_parent"
    android:background="#66000000"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
      android:id="@+id/tv_menu"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="菜单"
      android:textColor="#f40"
      android:textSize="24sp" />
  </LinearLayout>

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff"
    android:orientation="vertical">

    <android.support.v4.view.ViewPager
      android:id="@+id/vp_content"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content" />
  </LinearLayout>
</com.yhy.widget.layout.slider.SlideLayout>
    • 获取控件
    SlideLayout slSlide = findViewById(R.id.sl_slide);
TextView tvMenu = findViewById(R.id.tv_menu);
ViewPager vpContent = findViewById(R.id.vp_content);
    • 设置数据和事件
    // 为ViewPager设置适配器
vpContent.setAdapter(new PagerAdapter() {
  @Override
  public int getCount() {
    return 4;
  }

  @Override
  public boolean isViewFromObject(View view, Object object) {
    return view == object;
  }

  @Override
  public Object instantiateItem(ViewGroup container, int position) {
    ImageView iv = new ImageView(SliderActivity.this);
    iv.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
    iv.setScaleType(ImageView.ScaleType.CENTER_CROP);
    if (position == 0) {
      iv.setImageResource(R.mipmap.img_pager_1);
    } else if (position == 1) {
      iv.setImageResource(R.mipmap.img_pager_2);
    } else if (position == 2) {
      iv.setImageResource(R.mipmap.img_pager_3);
    } else {
      iv.setImageResource(R.mipmap.img_pager_4);
    }
    container.addView(iv);
    return iv;
  }

  @Override
  public void destroyItem(ViewGroup container, int position, Object object) {
    container.removeView((View) object);
  }
});

// 设置事件
// 当菜单按钮点击时关闭菜单
tvMenu.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View v) {
    slSlide.close();
  }
});

// 监听内容，根据需要改变侧滑菜单的可用性
slSlide.setOnSlideEnableWatcher(new SlideLayout.OnSlideEnableWatcher() {
  @Override
  public boolean shouldEnable() {
    //第二页禁用侧边栏
    return vpContent.getCurrentItem() != 1;
  }
});

// 菜单滑动状态监听
slSlide.setOnStateChangeListener(new SlideLayout.OnStateChangeListener() {
  @Override
  public void onOpened() {
    tvMenu.setText("已打开");
  }

  @Override
  public void onClosed() {
    tvMenu.setText("已关闭");
  }

  @Override
  public void onDragging(float percent, int dx, int total) {
    tvMenu.setText("比例：" + percent);
  }
});

  • StatusLayout

    状态管理页面布局【加载中，空数据，错误，成功】

    共有三种使用方法，分别是【默认，布局文件中配置，使用外部助手配置】

    多种使用方式的优先级关系为：布局文件中配置 > 使用外部助手配置 > 默认

    • 注意

    四种状态均用tag来做区分，所以必须要给各种页面设置对应的tag

    状态tag值
    加载中loading
    空数据empty
    错误error
    成功success

    • 默认方式

    • 布局文件

      <com.yhy.widget.layout.status.StatusLayout
android:id="@+id/sl_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff">

<!--当只有一个子控件时，该子控件会被当作[成功]状态的界面，此时无需指定tag为success-->
<LinearLayout
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:gravity="center"
  android:orientation="vertical"
  android:tag="success">

  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Success"
    android:textColor="#2f0"
    android:textSize="20sp" />
</LinearLayout>
</com.yhy.widget.layout.status.StatusLayout>

    • 布局文件中配置

    • 布局文件

      <com.yhy.widget.layout.status.StatusLayout
android:id="@+id/sl_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff">

<!-- 默认的加载中页面 -->
<com.yhy.widget.layout.status.view.StaLoadingView
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:tag="loading" />

<!-- 默认的错误页面 -->
<com.yhy.widget.layout.status.view.StaErrorView
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:tag="error" />

<!-- 默认的空数据页面 -->
<com.yhy.widget.layout.status.view.StaEmptyView
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:tag="empty" />

<!-- 成功页面 -->
<LinearLayout
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:gravity="center"
  android:orientation="vertical"
  android:tag="success">

  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Success"
    android:textColor="#2f0"
    android:textSize="20sp" />
</LinearLayout>
</com.yhy.widget.layout.status.StatusLayout>

    • 使用外部助手配置

    • 布局文件

      <com.yhy.widget.layout.status.StatusLayout
android:id="@+id/sl_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff">

<!-- 使用外部助手配置时，也可以在布局中配置，布局中优先使用 -->
<LinearLayout
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:gravity="center"
  android:orientation="vertical"
  android:tag="error">

  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:tag="retry"
    android:text="布局中定义的错误页面"
    android:textColor="#246854"
    android:textSize="20sp" />
</LinearLayout>

<!-- 成功页面 -->
<LinearLayout
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:gravity="center"
  android:orientation="vertical"
  android:tag="success">

  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Success"
    android:textColor="#2f0"
    android:textSize="20sp" />
</LinearLayout>
</com.yhy.widget.layout.status.StatusLayout>

    • 获取控件

      StatusLayout slContent = findViewById(R.id.sl_content);

    • 外部助手配置

      StaLayoutHelperBuilder builder = new StaLayoutHelperBuilder.Builder(slContent).setLoadingLayout(getLoadingView()).build();
// builder 还可以设置各种状态的view
slContent.setHelper(builder.getHelper());

// ...
private View getLoadingView() {
TextView tv = new TextView(this);
tv.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
tv.setText("Helper中定义的加载中");
tv.setGravity(Gravity.CENTER);
tv.setTextSize(18);
tv.setTextColor(Color.RED);
// 设置tag为loading
tv.setTag(StatusLayout.Status.LOADING.getStatus());
return tv;
}

    • 切换页面状态

    // 加载中
slContent.showLoading();
// 成功
slContent.showSuccess();
// 错误
slContent.showError();
// 空数据
slContent.showEmpty();

That's all, enjoy it !!!

天狼守徒
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
【Android】开发自定义控件和引入布局
摸鱼小小虫的博客
07-20 637
引入布局，创建一个新的布局，导入其他layout，创建自定义控件
Android自定义View与高级UI
yzpbright的博客
09-07 698
Android自定义View 概述 Android开发进阶的必经之路 为什么要自定义View 自定义View的基本方法 自定义View的最基本的三个方法分别是： onMeasure()、onLayout()、onDraw(); View在Activity中显示出来，要经历测量、布局和绘制三个步骤，分别对应三个动作：measure、layout和draw。 测量：onMeasure()决定View的大小； 布局：onLayout()决定View在ViewGroup中的位置； 绘制：onDraw()决定绘制这
Android自定义控件
最新发布
RandowWrite
06-03 863
invalidate方法用于在UI线程中请求重绘视图。当我们希望在主线程中更新UI时，可以在UI线程中直接调用invalidate()方法。内部实现：调用了invalidate方法后，为该View添加一个标记位，同时不断向父容器请求刷新，父容器通过计算得出自身需要重绘的区域，直到传递到ViewRootImpl中，最终触发performTraversals方法，开始View树重绘流程(只绘制需要重绘的视图)postInvalidate方法用于在非UI线程中请求重绘视图。
Android 实现形态各异的双向侧滑菜单 自定义控件来袭
modabobo
10-08 172
转载请标明出处：http://blog.csdn.net/lmj623565791/article/details/39670935，本文出自：【张鸿洋的博客】 1、概述 关于自定义控件侧滑已经写了两篇了~~今天决定把之前的单向改成双向，当然了，单纯的改动之前的代码也没意思，今天不仅会把之前的单向改为双向，还会多添加一种侧滑效果，给大家带来若干种形态各异的双向侧滑菜单，不过请放心，代码会很简单~~...
Android自定义组合控件
m0_57150356的博客
10-20 413
/用于Java文件中的构造函数//用于XML布局文件中的构造函数//获取属性值//回收获取自定义控件属性值以后一定要回收TypedArray//用于Java文件中的构造函数//用于XML布局文件中的构造函数。
Android自定义控件EditText使用详解
08-28
Android自定义控件EditText是Android开发中常用的控件之一，它可以满足开发者的多种需求。在本文中，我们将详细介绍Android自定义控件EditText的使用方法，包括自定义控件的分类、自定义EditText的实现步骤、attrs....
Android编程实现自定义控件的方法示例
01-04
很多时候Android常用的控件不能满足我们的需求，那么我们就需要自定义一个控件了。今天做了一个自定义控件的实例，来分享下。 首先定义一个layout实现按钮内部布局： <?xml version=1.0 encoding=utf-8?> &lt...
android 开发进阶 自定义控件 类似 TextView
11-25
在Android开发中，自定义控件是提升应用独特性和功能扩展性的重要手段。"android 开发进阶 自定义控件 类似 TextView" 这个主题，意味着我们将探讨如何基于TextView创建一个具有特定功能或视觉效果的新控件。...
Android自定义控件单位尺寸实现代码
08-19
在Android开发中，自定义控件的单位尺寸选择至关重要，因为不同的设备有着不同的屏幕尺寸和分辨率。本篇文章主要探讨了如何在Android中实现自定义控件的单位尺寸，并且介绍了dp和sp这两种适配不同屏幕密度的单位。 ...
Android-一个自定义的常用的工具类库
08-13
这是一个自定义的常用的工具类库，主要包括了UtilsManager、FileUtils、LogUitls、UIUtils、ListUtils、MD5Utils、RopUtils、RegexUtils、MediaUtils、SPUtils等常用的工具类
2024年最全Android自定义控件及自定义属性，哔哩哔哩面试笔试考什么
2401_84556528的博客
05-16 420
自定义一个类，继承View继承View还是哪个类，取决于你要实现一个什么样的控件如果你要实现的是一个线性布局的组合控件，就可以继承LinearLayout如果你要实现的是一个布局复杂的组合控件，就可以继承RelativeLayout具体根据实际情况这里我要实现一个Android端的显示验证码的控件，我只继承Viewpackage ……;import ……/***/…………// 画界面…………类似的，如果你是继承了RelativeLayout，大概可以这样实现。
Android常用自定义控件
zuoliangzhu的专栏
06-03 1392
http://www.see-source.com/androidwidget/list.html
Android自定义控件全览（一）
huye930610的博客
07-06 503
Android自定义控件总结 目的：收集和整理所有的Android自定义控件 文章目录Android自定义控件总结前言一、面包屑布局（BreadCrumbView）1.自定义BreadCrumbView，继承FrameLayout2.使用自定义BreadCrumbView3.使用效果3.项目目录：二、树型结构布局（TreeListView）1.引入库三、分页布局（jetpack的paging库）1.自定义控件2.使用自定义控件总结 前言 后续会不断添加自定义控件实例，希望做成一个Android自定义控
Android 自定义控件 Demo合集
system_err的博客
06-08 2022
NumberProgressBar(代码家)这个项目可以熟练掌握如何控制view在界面中的位子SmallChart项目包括折线图、曲线图(可填充)、柱状图、扇形图、雷达图的绘制，让你熟练使用draw()相关类。CircleImageView一个圆形的ImageViewPhotoView对ImageView支持各种手势操作，缩放、移动、旋转...熟练掌握手势操作。AndroidSwipeLayout...
Android自定义控件之自定义组合控件
这个男孩不简单的博客
03-21 972
使用自定义组合控件的好处？ 提高布局文件开发效率 降低布局文件维护成本 降低布局文件和Activity代码耦合性 容易扩展 简单易用 如何实现一个自定义组合控件 1.）先定义一个布局文件 <merge xmlns:android="http://schemas.android.com/apk/res/android"> <Button a...
Android酷炫自定义控件开源库集合
q9104422999的博客
05-31 4476
炫酷的登录界面 源码地址 https://github.com/Allenhan123/MaterialLogin 1.Side-Menu.Android 分类侧滑菜单，Yalantis出品。 项目地址：https://github.com/Yalantis/Side-Menu.Android2.Context-Menu.android 可以方便快速集成漂亮带有动画效果的上下文菜...
常用自定义控件
HUandroid的博客
08-10 691
常用自定义控件 仿QQ控件的头部拉伸Listview 守望先锋加载动画 viewpager的轮播控件 向上跑马灯
android studio自定义控件
06-28
要创建自定义控件，您需要在 Android Studio 中使用 Java 或 Kotlin 编程语言编写代码。 以下是创建自定义控件的基本步骤： 1. 创建一个新的 Java 或 Kotlin 类，并将其扩展为 View 类或其子类，以便您可以在其中...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值