本文共 6621 字，大约阅读时间需要 22 分钟。

@多条信息垂直滚动，垂直走马灯

多条信息垂直滚动，垂直走马灯

仿淘宝首页的淘宝头条垂直滚动 滚动布局继承了是ViewFlipper,可以实现进入动画，退出动画，设置切换时间间隔。 MarqueeView可用于多行或单行滚动，滚动的布局可以自定义。

使用介绍

1.MarqueeViewCode

``kotlin

• 类描述：仿淘宝首页的 淘宝头条滚动的自定义View

• 可以支持单行或多行，滚动布局自定义

  */
  public class MarqueeViewCode(context: Context, attrs: AttributeSet) : ViewFlipper(context, attrs) {
  private var mContext: Context? = null

  /**

  • 是否显示淡入淡出动画
    */
    private var isSetAlphaAnim = true

  /**

  • 切换间隔时间
    */
    private var interval = 5000

  /**

  • 动画时间
    */
    private var animDuration = 2000

  @SuppressLint(“Recycle”)

  private fun init(context: Context, attrs: AttributeSet, defStyleAttr: Int) {
  mContext = context
  val ta = context.obtainStyledAttributes(attrs, R.styleable.MarqueeViewUp, defStyleAttr, 0)
  isSetAlphaAnim = ta.getBoolean(R.styleable.MarqueeViewUp_isSetAlphaAnim, isSetAlphaAnim)
  interval = ta.getInteger(R.styleable.MarqueeViewUp_interval, interval)
  animDuration = ta.getInteger(R.styleable.MarqueeViewUp_animDuration, animDuration)
  flipInterval = interval

  //淡入淡出动画 var animationIn = AlphaAnimation(0.0f, 1.0f)//淡入 从透明到不透明 animationIn.duration = animDuration.toLong() //设置动画持续时间 val animationOut = AlphaAnimation(1.0f, 0.0f) //淡出 从不透明到透明 animationOut.duration = animDuration.toLong() //设置动画持续时间 //平移动画 val translateAnimationIn = TranslateAnimation(     Animation.RELATIVE_TO_SELF, 0.0f,     Animation.RELATIVE_TO_SELF, 0.0f,     Animation.RELATIVE_TO_SELF, 1.0f,     Animation.RELATIVE_TO_SELF, 0.0f ) //向上移动出现 val translateAnimationOut = TranslateAnimation(     Animation.RELATIVE_TO_SELF, 0.0f,     Animation.RELATIVE_TO_SELF, 0.0f,     Animation.RELATIVE_TO_SELF, 0.0f,     Animation.RELATIVE_TO_SELF, -1.0f ) //向上移动消失 translateAnimationIn.duration = animDuration.toLong() translateAnimationOut.duration = animDuration.toLong() // 动画集-- 进入动画 val animationInSet = AnimationSet(false) animationInSet.addAnimation(translateAnimationIn) // 动画集-- 退出动画 val animationOutSet = AnimationSet(false) animationOutSet.addAnimation(translateAnimationOut) if (isSetAlphaAnim) {     //设置淡入淡出动画     animationInSet.addAnimation(animationIn)     animationOutSet.addAnimation(animationOut) } inAnimation = animationInSet outAnimation = animationOutSet

  }

  /**

  • 设置循环滚动的View数组
  • @param views
    */
    fun setViews(views: List?) {
    if (views == null || views.size == 0) return
    removeAllViews()
    for (i in views.indices) {
    //设置监听回调
    views[i].setOnClickListener {
    if (onItemClickListener != null) {
    onItemClickListener!!.onItemClick(i, views[i])
    }
    }
    addView(views[i])
    }
    startFlipping()
    }

  /**

  • 点击回调
    */
    private var onItemClickListener: OnItemClickListener? =
    null

  /**

  • 设置监听接口
  • @param onItemClickListener
    */
    fun setOnItemClickListener(onItemClickListener: OnItemClickListener?) {
    this.onItemClickListener = onItemClickListener
    }

  /**

  • item_view的接口
    */
    interface OnItemClickListener {
    fun onItemClick(position: Int, view: View?)
    }

  init {

  init(context, attrs, 0)
  }

2.xml文件```xml
   

Attributes:

MainActivity

lass MainActivity : AppCompatActivity() {
       private var marqueeView1: MarqueeViewCode? = null    private var marqueeView2: MarqueeViewCode? = null    var data: MutableList
   
     = ArrayList()    var views1: MutableList
    
      = ArrayList()    var views2: MutableList
     
       = ArrayList()    override fun onCreate(savedInstanceState: Bundle?) {
           super.onCreate(savedInstanceState)        setContentView(R.layout.activity_main)        initView()        initData()        initParam()    }    override fun onResume() {
           super.onResume()        marqueeView1!!.startFlipping()    }    override fun onPause() {
           super.onPause()        marqueeView1!!.stopFlipping()    }    /**     * 初始化控件     */    fun initView() {
           marqueeView1 = findViewById(R.id.upview1)        marqueeView2 = findViewById(R.id.upview2)    }    /**     * 初始化数据     */    fun initData() {
           data = ArrayList()        data.add("git常用命令")        data.add("Git配置SSH访问GitHub(window)")        data.add("关于java的抽象和接口")        data.add("阿里HotFix2.0升级详解 畅谈热修复领域那些事")    }    /**     * 初始化界面程序     */    fun initParam() {
           setViewTwoLines()        setViewSingleLine()        marqueeView1?.setViews(views1)        marqueeView2?.setViews(views2)    }    /**     * 初始化需要循环的View     * 为了灵活的使用滚动的View，所以把滚动的内容让用户自定义     * 假如滚动的是三条或者一条，或者是其他，只需要把对应的布局，和这个方法稍微改改就可以了，     * 条数为奇数时做了些处理：奇数时最后一个没有内容 将第一个拼接到最后显示     */    private fun setViewTwoLines() {
           views1.clear()        for (index in 0 until data.size step 2) {
               var position: Int = index            //设置滚动的单个布局            val moreView =                LayoutInflater.from(this).inflate(R.layout.item_view, null) as LinearLayout            //初始化布局的控件            val tv1 = moreView.findViewById
      
       (R.id.tv1) as TextView            val tv2 = moreView.findViewById
       
        (R.id.tv2) as TextView            //进行对控件赋值            tv1.text = data[index]            if (data.size > index + 1) {
   //奇数条                tv2.text = data[index + 1]            } else {
   //偶数条                //因为淘宝那儿是两条数据，但是当数据是奇数时就不需要赋值第二个，所以加了一个判断，还应该把第二个布局给隐藏掉                //moreView.findViewById(R.id.rl2).setVisibility(View.GONE);                //修改了最后一个没有 将第一个拼接到最后显示                tv2.text = data[0]            }            /**             * 设置监听             */            moreView.findViewById
        
         (R.id.rl).setOnClickListener { Toast.makeText( this, position as String + "你点击了" + data[position].toString(), Toast.LENGTH_SHORT ).show(); } /** * 设置监听 */ moreView.findViewById
         
          (R.id.rl2).setOnClickListener { if (data.size > position + 1) { Toast.makeText( applicationContext, position as String + "你点击了" + data[position + 1].toString(), Toast.LENGTH_SHORT ).show(); } else { Toast.makeText( applicationContext, position as String + "你点击了" + data[0].toString(), Toast.LENGTH_SHORT ).show(); } } //添加到循环滚动数组里面去 views1.add(moreView) } } /** * 自定义布局——单行滚动 */ private fun setViewSingleLine() { views2.clear() for (i in 0 until data.size) { var position = i //设置滚动的单个布局 val moreView = LayoutInflater.from(this).inflate(R.layout.item_view_single, null) as LinearLayout //初始化布局的控件 val tv1 = moreView.findViewById
          
           (R.id.tv1) as TextView //进行对控件赋值 tv1.text = data[i] moreView.findViewById
           
            (R.id.rl).setOnClickListener { Toast.makeText( applicationContext, position as String + "你点击了" + data[position].toString(), Toast.LENGTH_SHORT ).show(); } //添加到循环滚动数组里面去 views2.add(moreView) } }}
           
          
         
        
       
      
     
    
   

借鉴来自 https://www.jianshu.com/p/8b052478d7df?utm_campaign=haruki&utm_content=note&utm_medium=reader_share&utm_source=qq

转载地址：https://blog.csdn.net/zhanghuaiwang/article/details/116935063 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！