简易版

代码
public class UPMarqueeView extends ViewFlipper {
   public UPMarqueeView(Context context, AttributeSet attrs) {

super(context);
init(context, null, 0);
}
public UPMarqueeView(Context context, AttributeSet attrs) {
super(context, attrs);
init(context, attrs, 0);
}
private void init(Context context, AttributeSet attrs, int defStyleAttr) {
setFlipInterval(3000);
Animation animIn = AnimationUtils.loadAnimation(getContext(), R.anim.anim_marquee_in);
animIn.setDuration(500);
setInAnimation(animIn);
Animation animOut = AnimationUtils.loadAnimation(getContext(), R.anim.anim_marquee_out);
animOut.setDuration(500);
setOutAnimation(animOut);
}

/**设置循环滚动的View数组 */
public void setViews(final List<UPMarqueeViewData> datas) {
if (datas == null || datas.size() == 0) return;
int size = datas.size();
for (int i = 0; i < size; i++) {
final int num = i;
TextView tv = new TextView(getContext());
tv.setText(datas.get(i).Title);
tv.setTextColor(0xff424954);
tv.setTextSize(TypedValue.COMPLEX_UNIT_SP, 12);
tv.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Activity_Browser.launche(getContext(), "移动端公告", datas.get(num).PageUrl);
}
});
addView(tv);
}
}
}

public class UPMarqueeViewData {
public String Title;
public String PageUrl;
}
public List<UPMarqueeViewData> mList;
tb.setViews(mList);
tb.startFlipping();
布局
<LinearLayout
android:layout_width="match_parent"
android:layout_height="30dp"
android:background="@android:color/white"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingLeft="15dp"
android:paddingRight="15dp">

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/main_tb"/>

<com.bcb.presentation.view.custom.UPMarqueeView
android:id="@+id/tb"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:gravity="center_vertical"/>

</LinearLayout>
2017-2-27

Activity中使用

public class MainActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        UPMarqueeView upview = (UPMarqueeView) findViewById(R.id.upview);
        List<UPMarqueeViewData> data = new ArrayList<UPMarqueeViewData>();
        data.add(new UPMarqueeViewData("疯传", "家人给2岁孩子喝这个,孩子智力倒退10岁!", "1"));
        data.add(new UPMarqueeViewData("头条", "iPhone8最感人变化成真,必须买买买!", "2"));
        data.add(new UPMarqueeViewData("热议", "简直是白菜价!日本玩家33万甩卖15万张游戏王卡", "3"));
        data.add(new UPMarqueeViewData("哈哈", "iPhone7价格曝光了!看完感觉我的腰子有点疼,包青天包青天包青天包青天包青天", "4"));
        data.add(new UPMarqueeViewData("呵呵", "主人内疚逃命时没带够,回废墟狂挖30小时!", "5"));
        upview.setViews(data);
        upview.startFlipping();
    }

}


自定义的View

/**
 * 仿淘宝首页的 淘宝头条滚动的自定义View
 */
public class UPMarqueeView extends ViewFlipper {
    private Context mContext;
    /**是否开启动画*/
    private boolean isSetAnimDuration = true;
    /**时间间隔*/
    private int interval = 3000;
    /**动画时间 */
    private int animDuration = 500;
    public UPMarqueeView(Context context) {
        super(context);
        init(context, null, 0);
    }
    public UPMarqueeView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs, 0);
    }
    private void init(Context context, AttributeSet attrs, int defStyleAttr) {
        this.mContext = context;
        setFlipInterval(interval);
        if (isSetAnimDuration) {
            Animation animIn = AnimationUtils.loadAnimation(mContext, R.anim.anim_marquee_in);
            animIn.setDuration(animDuration);
            setInAnimation(animIn);
            Animation animOut = AnimationUtils.loadAnimation(mContext, R.anim.anim_marquee_out);
            animOut.setDuration(animDuration);
            setOutAnimation(animOut);
        }
    }
    /**
     * 设置循环滚动的View数组
     * @param views
     */
    public void setViews(final List<UPMarqueeViewData> datas) {
        if (datas == null || datas.size() == 0) return;
        int size = datas.size();
        for (int i = 0; i < size; i += 2) {
            final int position = i;
            //根布局
            LinearLayout item = (LinearLayout) LayoutInflater.from(mContext).inflate(R.layout.item, null);
            //设置监听
            item.findViewById(R.id.rl).setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    Toast.makeText(mContext, "你点击了" + datas.get(position).getValue(), Toast.LENGTH_SHORT).show();
                }
            });
            //控件赋值
            ((TextView) item.findViewById(R.id.tv1)).setText(datas.get(position).getValue());
            ((TextView) item.findViewById(R.id.title1)).setText(datas.get(position).getTitle());
            //当数据是奇数时,最后那个item仅有一项
            if (position + 1 < size) {
                item.findViewById(R.id.rl2).setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        Toast.makeText(mContext, "你点击了" + datas.get(position + 1).getValue(), Toast.LENGTH_SHORT).show();
                    }
                });
                ((TextView) item.findViewById(R.id.tv2)).setText(datas.get(position + 1).getValue());
                ((TextView) item.findViewById(R.id.title2)).setText(datas.get(position + 1).getTitle());
            } else item.findViewById(R.id.rl2).setVisibility(View.GONE);
            addView(item);
        }
    }
    public boolean isSetAnimDuration() {
        return isSetAnimDuration;
    }
    public void setSetAnimDuration(boolean isSetAnimDuration) {
        this.isSetAnimDuration = isSetAnimDuration;
    }
    public int getInterval() {
        return interval;
    }
    public void setInterval(int interval) {
        this.interval = interval;
    }
    public int getAnimDuration() {
        return animDuration;
    }
    public void setAnimDuration(int animDuration) {
        this.animDuration = animDuration;
    }

}


数据bean

public class UPMarqueeViewData {
    private String title;
    private String value;
    private String url;
    public UPMarqueeViewData(String title, String value, String url) {
        super();
        this.title = title;
        this.value = value;
        this.url = url;
    }
    public String getTitle() {
        return title;
    }
    public void setTitle(String title) {
        this.title = title;
    }
    public String getUrl() {
        return url;
    }
    public void setUrl(String url) {
        this.url = url;
    }
    public String getValue() {
        return value;
    }
    public void setValue(String value) {
        this.value = value;
    }

}

item的布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/gray"
    android:gravity="center"
    android:orientation="vertical" >
    <RelativeLayout
        android:id="@+id/rl"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >
        <TextView
            android:id="@+id/title1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginRight="6dp"
            android:background="@drawable/border"
            android:padding="2dp"
            android:textColor="@color/red"
            android:textSize="12sp" />
        <TextView
            android:id="@+id/tv1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@+id/title1"
            android:ellipsize="end"
            android:maxLines="1"
            android:textSize="14sp" />
    </RelativeLayout>
    <RelativeLayout
        android:id="@+id/rl2"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >
        <TextView
            android:id="@+id/title2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginRight="6dp"
            android:background="@drawable/border"
            android:padding="2dp"
            android:textColor="@color/red"
            android:textSize="12sp" />
        <TextView
            android:id="@+id/tv2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@+id/title2"
            android:ellipsize="end"
            android:maxLines="1"
            android:textSize="14sp" />
    </RelativeLayout>

</LinearLayout>


附件列表

自定义控件 淘宝头条【ViewFlipper】的更多相关文章

  1. Android 仿淘宝头条竖直跑马灯式新闻标题及“分页思想

    在淘宝App的首页中间位置,有一块小小的地方在不知疲倦地循坏滚动着头条标题(见下图的红框区域),这样的设计无疑能够在有限的手机屏幕上展示更丰富的内容.而实现这一功能需要用到的控件就是我在上一篇文章中提 ...

  2. 【angularjs】使用angularjs模拟淘宝首页-淘宝头条滚动效果

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. Android仿淘宝头条滚动广告条

    之前我使用TextView+Handler+动画,实现了一个简单的仿淘宝广告条的滚动,https://download.csdn.net/download/qq_35605213/9660825: 无 ...

  4. ViewFlipper 淘宝头条 轮播 自动切换

    ViewFlipper介绍 ViewFilpper类继承于ViewAnimator,而ViewAnimator类继承于FrameLayout.     ViewAnimator: Base class ...

  5. Python的几个爬虫代码整理(网易云、微信、淘宝、今日头条)

    整理了一下网易云歌曲评论抓取.分析好友信息抓取.淘宝宝贝抓取.今日头条美图抓取的一些代码 抓取网易云评论 进入歌曲界面: http://music.163.com/#/song?id=45318582 ...

  6. Android自定义控件实战——仿淘宝商品浏览界面

    转载请声明出处http://blog.csdn.net/zhongkejingwang/article/details/38656929 用手机淘宝浏览商品详情时,商品图片是放在后面的,在第一个Scr ...

  7. 淘宝UWP中的100个为什么

    从淘宝UWP第一版发布到现在,已经有十个月了,期间收到了用户各种各样的反馈,感谢这些用户的反馈,指导我们不断的修正.完善应用.但是也有一部分需求或建议,由于资源或技术的限制,目前确实无法做到,只能对广 ...

  8. iOS开发之三个Button实现图片无限轮播(参考手机淘宝,Swift版)

    这两天使用Reveal工具查看"手机淘宝"App的UI层次时,发现其图片轮播使用了三个UIButton的复用来实现的图片循环无缝滚动.于是乎就有了今天这篇博客,看到“手机淘宝”这个 ...

  9. Android之仿京东淘宝的自动无限轮播控件

    在App的开发中,很多的时候都需要实现类似京东淘宝一样的自动无限轮播的广告栏,所以就自己写了一个,下面是我自定义控件的思路和过程. 一.自定义控件属性 新建自定义控件SliderLayout继承于Re ...

随机推荐

  1. Python 爬虫笔记(三)

    from selenium import webdriver from selenium.webdriver.common.action_chains import ActionChains #Act ...

  2. thinkphp5.0架构总览

    ThinkPHP5.0应用基于MVC(模型-视图-控制器)的方式来组织. MVC是一个设计模式,它强制性的使应用程序的输入.处理和输出分开.使用MVC应用程序被分成三个核心部件:模型(M).视图(V) ...

  3. fastadmin: layer.open 弹出层如何在表单提交之后自动关闭?

    需要在控制器对应的js文件中添加   Form.api.bindevent($("form[role=form]")); define(['jquery', 'bootstrap' ...

  4. ssm demo,用户角色权限管理

    SSM框架整合 Spring SpringMVC MyBatis 导包: 1, spring 2, MyBatis 3, mybatis-spring 4, fastjson 5, aspectwea ...

  5. http1.0和1.1的区别

    1.HTTP 1.1支持长连接(PersistentConnection)和请求的流水线(Pipelining)处理 HTTP 1.0规定浏览器与服务器只保持短暂的连接,浏览器的每次请求都需要与服务器 ...

  6. 洛谷——P1349 广义斐波那契数列

    题目描述 广义的斐波那契数列是指形如an=p*an-1+q*an-2的数列.今给定数列的两系数p和q,以及数列的最前两项a1和a2,另给出两个整数n和m,试求数列的第n项an除以m的余数. 输入输出格 ...

  7. eclipse JavaEE的配置

    Eclipse IDE for Java EE Developers(win32) 下载地址:http://mirror.bjtu.edu.cn/eclipse/technology/epp/down ...

  8. SpringBoot学习(六)

    1.pom 文件 <?xml version="1.0" encoding="utf-8"?> <dependencies> <d ...

  9. [BZOJ4240]有趣的家庭菜园(贪心+树状数组)

    最后数列一定是单峰的,问题就是最小化最后的位置序列的逆序对数. 从大到小加数,每次贪心看放左边和右边哪个产生的逆序对数更少,树状数组即可. 由于大数放哪对小数不产生影响,所以正确性显然. 注意相同数之 ...

  10. SpringMvc配置详解

    在此做一个对Mvc的复习,便于以后快速复习mvc配置. 开发环境 : IDe :iDEA JDK:1.8 使用的框架技术:Mybtais ,Spring,Spring MVC 数据源选用Dbcp 首先 ...