专栏首页恩蓝脚本Android自定义控件ViewFipper实现竖直跑马灯效果

Android自定义控件ViewFipper实现竖直跑马灯效果

一直想实现一个竖直跑马灯的效果,今天接触到了ViewFlipper这个控件, 是做安卓视图切换的, 对其用自定义控件进行包装;实现其点击回调和自定义视图等功能

不多说,直接上代码:

定义了一个自定义控件, 继承LinearLayout

package com.example.viewfipperdemo; 
 
import android.content.Context; 
import android.util.AttributeSet; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.LinearLayout; 
import android.widget.TextView; 
import android.widget.ViewFlipper; 
 
/** 
 * Created by zmybi on 2017/1/19. 
 */ 
 
public class MarqueeTextView extends LinearLayout { 
 
 private Context mContext; 
 private String[] strs; 
 private View mView; 
 
 private OnTextClickListener mOnTextClickListener; 
 private ViewFlipper mViewFlipper; 
 
 
 public MarqueeTextView(Context context) { 
  this(context,null); 
  this.mContext = context; 
 } 
 
 public MarqueeTextView(Context context, AttributeSet attrs) { 
  super(context, attrs); 
  this.mContext = context; 
 
  initBasicView(); 
 } 
 
 /** 
  * 用于外界向里面传值,并且初始化控件中的ViewFipper 
  * @param str 
  * @param onTextClickListener 
  */ 
 public void setData(String[] str,OnTextClickListener onTextClickListener) { 
  this.strs = str; 
  this.mOnTextClickListener = onTextClickListener; 
  initViewFipper(); 
 } 
 
 
 
 private void initBasicView() { 
  mView = LayoutInflater.from(mContext).inflate(R.layout.layout_viewfipper,null); 
  mViewFlipper = (ViewFlipper) mView.findViewById(R.id.viewflipper); 
 
  mViewFlipper.setInAnimation(mContext,R.anim.in); //进来的动画 
  mViewFlipper.setOutAnimation(mContext,R.anim.out); //出去的动画 
 
  LayoutParams params = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT); 
  addView(mView,params); 
 
  mViewFlipper.startFlipping(); 
 } 
 
 /** 
  * 定义销毁的方法 
  */ 
 public void clearViewFlipper() { 
  if(mView != null) { 
   if(mViewFlipper != null) { 
    mViewFlipper.stopFlipping(); 
    mViewFlipper.removeAllViews(); 
    mViewFlipper =null; 
   } 
   mView = null; 
  } 
 } 
 
 
 /** 
  * 初始化viewFipper中的自孩子视图 
  */ 
 private void initViewFipper() { 
  if(strs.length == 0) { 
   return; 
  } 
 
  int i = 0; 
  mViewFlipper.removeAllViews(); 
  while (i < strs.length) { //循环3次 
   final TextView tv = new TextView(mContext); 
   tv.setText(strs[i]); 
 
   tv.setOnClickListener(new OnClickListener() { 
    @Override 
    public void onClick(View view) { 
     if(mOnTextClickListener != null) { 
      mOnTextClickListener.onClick(tv); 
     } 
    } 
   }); 
   mViewFlipper.addView(tv); 
   i++; 
  } 
 
 } 
} 

给viewFlipper设置动画的写法:

in.xml

<?xml version="1.0" encoding="utf-8"?  
<set xmlns:android="http://schemas.android.com/apk/res/android"  
 
 <translate 
  android:duration="@android:integer/config_mediumAnimTime" 
  android:fromYDelta="50%p" 
  android:toYDelta="0" /  
 <alpha 
  android:duration="@android:integer/config_mediumAnimTime" 
  android:fromAlpha="0.0" 
  android:toAlpha="1.0" /  
 
</set  

out.xml:

<?xml version="1.0" encoding="utf-8"?  
<set xmlns:android="http://schemas.android.com/apk/res/android"  
 
 <translate 
  android:duration="@android:integer/config_mediumAnimTime" 
  android:fromYDelta="0" 
  android:toYDelta="-50%p" /  
 <alpha 
  android:duration="@android:integer/config_mediumAnimTime" 
  android:fromAlpha="1.0" 
  android:toAlpha="0.0" /  
 
</set  

我们看一下layout_viewflipper布局的写法:

<?xml version="1.0" encoding="utf-8"?  
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"  
 
 <ViewFlipper 
  android:padding="10dp" 
  android:layout_width="match_parent" 
  android:layout_height="wrap_content" 
  android:id="@+id/viewflipper" 
  android:background="#33ff0000" 
  android:flipInterval="2000" 
   </ViewFlipper  
 
</LinearLayout  

其中flipInterval 是决定切换的时间的

我们再来看看MainActivity中的代码:

package com.example.viewfipperdemo; 
 
import android.support.v7.app.AppCompatActivity; 
import android.os.Bundle; 
import android.view.View; 
import android.widget.TextView; 
import android.widget.Toast; 
 
public class MainActivity extends AppCompatActivity { 
 
 /** 
  * 自定义的可滚动的TextView 
  */ 
 private MarqueeTextView mMarqueeTextView; 
 
 private String[] str = {"我是1","我是2","我是3"}; 
 
 @Override 
 protected void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  setContentView(R.layout.activity_main); 
 
  mMarqueeTextView = (MarqueeTextView) findViewById(R.id.marqueetextview); 
 
  mMarqueeTextView.setData(str, new OnTextClickListener() { 
   @Override 
   public void onClick(View view) { 
    Toast.makeText(MainActivity.this,((TextView)view).getText(),Toast.LENGTH_LONG).show(); 
   } 
  }); 
 } 
 
 @Override 
 protected void onDestroy() { 
  super.onDestroy(); 
  mMarqueeTextView.clearViewFlipper(); 
 } 
} 

对了,还定义了一个接口:

package com.example.viewfipperdemo; 
 
import android.view.View; 
 
/** 
 * Created by zmybi on 2017/1/19. 
 */ 
 
public interface OnTextClickListener { 
 
 void onClick(View view); 
} 

至此,如上的竖直跑马灯就完成了。

以上就是本文的全部内容,希望对大家的学习有所帮助。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 基于popupWindow实现悬浮半透明效果

    本文实例为大家分享了popupWindow实现悬浮半透明效果的具体代码,供大家参考,具体内容如下

    砸漏
  • Android开关控件Switch的使用案例

    在很多app的设置页面,或者是一些功能的开关界面,我们常常用到 Switch(开关) 来展示状态,今天说说Switch控件。

    砸漏
  • Android自定义View实现箭头沿圆转动实例代码

    以上所述是小编给大家介绍的Android自定义View实现箭头沿圆转动实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非...

    砸漏
  • Android使用手势实现翻页效果

    本程序的手势检测思路就是把Activity的TouchEvent交给GestureDetector处理,本程序使用了一个ViewFlipper组件,ViewFl...

    砸漏
  • Android 入门程序 Kotlin版(1)

    4个组件 TextView,Button,TextEdit,ImageView依次纵向线性布局。

    用户6021899
  • Android自定义顶部标题栏

    本文实例为大家分享了Android自定义顶部标题栏展示的具体代码,供大家参考,具体内容如下

    砸漏
  • Android扫描和生成二维码

    本文实例为大家分享了Android扫描和生成二维码的具体代码,供大家参考,具体内容如下

    砸漏
  • Android retrofit上传文件实例(包含头像)

    拦截器:https://www.zalou.cn/article/133257.htm

    砸漏
  • Android PopupWindow实现微信右上角的弹出菜单

    日常开发过程中对于PopupWindown的使用也是比较多的。这里给大家展示一下PopupWindow的使用。

    砸漏
  • Android首页无限轮播功能的示例代码

    对于一个App几乎都有Banner广告功能,也就是我们常见的轮播图,当然目前市场第三方框架已经非常成熟了,尤其是youth5201314/banner这里有gi...

    砸漏

扫码关注云+社区

领取腾讯云代金券