Android view的预加载占位效果封装使用

作为UI的基础功能组件,如果不进行封装后再使用,会出现大量重复代码,所以我封装了。

1.静态效果图展示
2.代码调用
3.自定义动画效果
4.代码调用
5.在RecyclerView使用
6.代码调用
7.钉钉考勤-圆形和方形的效果
8.代码调用
9.封装代码BroccoliManager.java
10.总结

1.静态效果图展示

image

2.代码调用

    private void initPlaceholders(){
        BroccoliManager.initStatic(this, R.id.tv_view_time, R.id.tv_collect_time,
                R.id.tv_price, R.id.iv_clock, R.id.tv_time, R.id.iv_calendar, R.id.iv_location,
                R.id.tv_location, R.id.iv_arrow_right, R.id.iv_logo, R.id.tv_organizer_name, R.id.tv_organizer_description,
                R.id.tv_fans, R.id.tv_fans_number, R.id.tv_events, R.id.tv_events_number, R.id.tv_follow, R.id.tv_station);
        BroccoliManager.show();
        showPlaceholders();
    }

    private void showPlaceholders(){
        mHandler.removeCallbacks(task);
        mHandler.postDelayed(task,2000);
    }

    private Runnable task = new Runnable() {
        @Override
        public void run() {
            showData();
        }
    };

    private void showData() {
        BroccoliManager.staticClear();
    }

3.自定义动画效果

image

4.代码调用

    private void initPlaceholders() {
        BroccoliManager.initAction(
                tvViewTimes,
                tvCollectTimes,
                tvPrice,
                ivClock,
                tvTime,
                ivCalendar,
                ivLocation,
                tvLocation,
                ivRightArrow,
                ivLogo,
                tvOrganizer,
                tvOrganizerDescription,
                tvFans,
                tvFansNumber,
                tvEvents,
                tvEventsNumber,
                tvFollow,
                tvStation
        );
        BroccoliManager.show();
        showPlaceholders();
    }

    private void showPlaceholders() {
        mHandler.removeCallbacks(task);
        mHandler.postDelayed(task, 3000);
    }

    private Runnable task = new Runnable() {
        @Override
        public void run() {
            showData();
        }
    };

    private void showData() {
        BroccoliManager.staticClear();
    }

5.在RecyclerView使用

image

6.代码调用


    private class MyAdapter extends RecyclerView.Adapter<MyViewHolder> {

        @NonNull
        @Override
        public MyViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
            View view = getLayoutInflater().inflate(R.layout.recyclerview_sample_item, viewGroup, false);
            return new MyViewHolder(view);
        }

        @Override
        public void onBindViewHolder(@NonNull final MyViewHolder myViewHolder, final int i) {
            BroccoliManager.initRecyclerView(myViewHolder.itemView
                    , myViewHolder.tvTitle
                    , myViewHolder.imageView
                    , myViewHolder.tvPrice
                    , myViewHolder.tvDescription);


            //delay to show the data
            Runnable task = mTaskManager.get(myViewHolder.itemView);
            if (task == null) {

                task = new Runnable() {
                    @Override
                    public void run() {
                        //when you need to update data, you must to call the remove or the clear method.
                        BroccoliManager.byItemViewClear(myViewHolder.itemView);

                        if (mDataList.isEmpty()) {
                            return;
                        }

                        myViewHolder.imageView.setImageResource(mDataList.get(i).imageRes);
                        myViewHolder.tvPrice.setText("¥ " + String.valueOf(mDataList.get(i).price));
                        myViewHolder.tvTitle.setText(mDataList.get(i).title);
                        myViewHolder.tvDescription.setText(mDataList.get(i).description);
                    }
                };
                mTaskManager.put(myViewHolder.itemView, task);
            } else {
                myViewHolder.itemView.removeCallbacks(task);
            }
            myViewHolder.itemView.postDelayed(task, 3000);
        }

        @Override
        public int getItemCount() {
            return mDataList.size();
        }
    }

    private class MyViewHolder extends RecyclerView.ViewHolder {
        private ImageView imageView;
        private TextView tvTitle;
        private TextView tvDescription;
        private TextView tvPrice;

        public MyViewHolder(@NonNull View itemView) {
            super(itemView);

            imageView = itemView.findViewById(R.id.iv_image);
            tvTitle = itemView.findViewById(R.id.tv_title);
            tvDescription = itemView.findViewById(R.id.tv_description);
            tvPrice = itemView.findViewById(R.id.tv_price);
        }
    }

7.钉钉考勤-圆形和方形的效果

image
image

8.代码调用


    private void initPlaceholders() {
        BroccoliManager.staticSquare(
                 findViewById(R.id.tv_name),
                 findViewById(R.id.tv_description),
                 findViewById(R.id.tv_day_des),
                 findViewById(R.id.v_shangban),
                 findViewById(R.id.v_xiaban),
                 findViewById(R.id.v_timeline),
                 findViewById(R.id.tv_shangban),
                 findViewById(R.id.tv_xiaban),
                 findViewById(R.id.tv_daka_des));
        BroccoliManager.staticCircular(
                findViewById(R.id.iv_head),
                findViewById(R.id.tv_daka) );
        BroccoliManager.show();


        showPlaceholders();
    }

    private void showPlaceholders() {
        mHandler.removeCallbacks(task);
        mHandler.postDelayed(task, 2000);
    }

    private Runnable task = new Runnable() {
        @Override
        public void run() {
            BroccoliManager.staticClear();
        }
    };

9.封装代码BroccoliManager.java


/**
 * 占位符管理类
 */
public class BroccoliManager {
    private static Broccoli mBroccoli;
    // 给Recycler的item用的。
    private static Map<View, Broccoli> mViewPlaceholderManager = new HashMap<>();

    /**
     * 静态的占位符
     *
     * @param context 上下文 activity
     * @param views   R.id.控件的id
     */
    public static void initStatic(Activity context, int... views) {
        if (mBroccoli == null) {
            mBroccoli = new Broccoli();
        }
        for (int view : views) {
            mBroccoli.addPlaceholders(context, view);
        }
    }

    /**
     * 动态占位符
     *
     * @param views 已绑定好的view
     */
    public static void initAction(View... views) {
        mBroccoli = new Broccoli();
        for (View view : views) {
            mBroccoli.addPlaceholders(PlaceholderHelper.getParameter(view));
        }

    }

    /**
     * RecyclerView的动态占位符
     *
     * @param itemView recyclerView整项内容的View
     * @param views    里面各小项内容的view
     */
    public static void initRecyclerView(View itemView, View... views) {
        Broccoli broccoli = mViewPlaceholderManager.get(itemView);
        if (broccoli == null) {
            broccoli = new Broccoli();
            mViewPlaceholderManager.put(itemView, broccoli);
        }
        for (View view : views) {
            broccoli.addPlaceholder(new PlaceholderParameter.Builder()
                    .setView(view)
                    .setDrawable(new BroccoliGradientDrawable(Color.parseColor("#DDDDDD"),
                            Color.parseColor("#CCCCCC"), 0, 1000, new LinearInterpolator()))
                    .build());
        }
        broccoli.show();
    }

    /**
     * 根据大项itemView来清除占位符
     *
     * @param itemView
     */
    public static void byItemViewClear(View itemView) {
        if (itemView != null) {
            Broccoli broccoli = mViewPlaceholderManager.get(itemView);
            broccoli.removeAllPlaceholders();
        }
    }

    /**
     * 当用recyclerView时在onDestroy时将mViewPlaceholderManager清空
     * 防止使用BroccoliGradientDrawable时内存泄露
     */
    public static void recyclerViewOnDestroy() {
        //Prevent memory leaks when using BroccoliGradientDrawable
        //防止使用BroccoliGradientDrawable时内存泄露
        for (Broccoli broccoli : mViewPlaceholderManager.values()) {
            broccoli.removeAllPlaceholders();
        }

        mViewPlaceholderManager.clear();
    }

    /**
     * 清除静态占位符
     */
    public static void staticClear() {
        if (mBroccoli != null) {
            mBroccoli.removeAllPlaceholders();
        }
    }

    /**
     * 圆形占位符
     *
     * @param views 可以多个圆形view 进行处理
     */
    public static void staticSquare(View... views) {
        int placeholderColor = Color.parseColor("#DDDDDD");
        if (mBroccoli == null) {
            mBroccoli = new Broccoli();
        }
        for (View view : views) {
            mBroccoli.addPlaceholders(
                    new PlaceholderParameter.Builder()
                            .setView(view)
                            .setDrawable(DrawableUtils.createRectangleDrawable(placeholderColor, 0))
                            .build());
        }

    }
    public static void show(){
        mBroccoli.show();
    }

    /**
     * 圆形占位符
     *
     * @param views 可以多个圆形view 进行处理
     */
    public static void staticCircular(View... views) {
        int placeholderColor = Color.parseColor("#DDDDDD");
        if (mBroccoli == null) {
            mBroccoli = new Broccoli();
        }
        for (View view : views) {
            mBroccoli.addPlaceholders(
                    new PlaceholderParameter.Builder()
                            .setView(view)
                            .setDrawable(DrawableUtils.createOvalDrawable(placeholderColor))
                            .build());
        }
    }

}

10.总结

我是参考Android view的预加载占位效果封装使用
的文章进行更改的。
我的源码:https://pan.baidu.com/s/1rzMmcXAqFmSBL1I8O6ZHpg
提取码:w9a1

依赖

Gradle

将其添加到你的module的build.gradle中:

dependencies {
    implementation 'me.samlss:broccoli:1.0.0'
}

Maven

<dependency>
  <groupId>me.samlss</groupId>
  <artifactId>broccoli</artifactId>
  <version>1.0.0</version>
  <type>pom</type>
</dependency>

Github地址

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,080评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,422评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,630评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,554评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,662评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,856评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,014评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,752评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,212评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,541评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,687评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,347评论 4 331
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,973评论 3 315
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,777评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,006评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,406评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,576评论 2 349