之前我使用TextView+Handler+动画，实现了一个简单的仿淘宝广告条的滚动，https://download.csdn.net/download/qq_35605213/9660825；
无意中发现ViewFlipper这个控件，拿来一试；很轻松的就实现了文字的替换功能；
下载地址：点击打开链接
代码：
private ViewFlipper vf;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
vf = findViewById(R.id.vf);
vf.setFlipInterval(2000);//设置时间间隔
setData();
}
String datas[] = {"对Kotlin的第一印象"
,"Android.Kotlin的杀手锏"
,"Kotlin很简洁"
,"Kotlin很擅长“拿来主义"
,"其实我也就是走马观花"};
private void setData() {
for (int i = 0; i < datas.length; i++) {
TextView tv = new TextView(this);
tv.setText(datas[i]);
vf.addView(tv); //把需要滚动布局添加到ViewFlipper
}
vf.startFlipping(); //开始滚动
}
XML布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.admin.viewflipperdemo.MainActivity"> <ViewFlipper
android:id="@+id/vf"
android:layout_centerInParent="true"
android:layout_width="match_parent"
android:layout_height="50dp"
/> </RelativeLayout>
只不过没有动画的效果，下面我再给它加上从下面滑进来和向上滑出去的动画；
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<!--进场动画-->
<translate
android:duration="300"
android:fromYDelta="100%p"
android:toYDelta="0"/>
<alpha
android:duration="500"
android:fromAlpha="0.0"
android:toAlpha="1.0"/>
</set>
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<!--滑出动画-->
<translate
android:duration="400"
android:fromYDelta="0"
android:toYDelta="-100%p"/>
<alpha
android:duration="500"
android:fromAlpha="1.0"
android:toAlpha="0.0"/>
</set>
vf.setInAnimation(this,R.anim.in); //设置动画效果
vf.setOutAnimation(this,R.anim.out);
哈哈，这下效果就很像了；
不过淘宝是双条的，这个怎么实现呢？
private ViewFlipper vf;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
vf = findViewById(R.id.vf);
vf.setFlipInterval(2000);//设置时间间隔
vf.setInAnimation(this,R.anim.in);
vf.setOutAnimation(this,R.anim.out);
setData();
}
String datas[] = {"鹿皮绒高腰小西装裤子女九分阔腿裤侧边条纹"
,"显瘦休闲运动裤女春秋薄款直筒长裤宽松卫裤"
,"春季浅色格子裤女九分裤松紧腰捆绳宽松显瘦千鸟格哈伦休闲裤"
,"秋冬新款宽松毛呢小脚哈伦裤休闲裤女显瘦呢子长裤加厚款大码潮"
,"春秋季新款心型碎花松紧腰长袖中长款连衣裙女宽松显瘦波点裙"
,"运动服套装女春秋时尚2018新款修身韩版卫衣春季休闲跑步两件套潮"
,"职业装女装套装时尚西装连衣裙ol气质工作服女春秋正装套装裙"
,"秋季卫衣女韩版学生百搭上衣宽松显瘦连帽2017时尚新款长袖外套潮"
,"2鹿皮绒高腰小西装裤子女九分阔腿裤侧边条纹"};
private void setData() {
for (int i = 0; i < datas.length; i= i+2) { //一次遍历两条数据
View v = View.inflate(this,R.layout.item,null);
TextView tv1 = v.findViewById(R.id.tv1);
TextView tv2 = v.findViewById(R.id.tv2);
tv1.setText(datas[i]);
if (datas.length > i+1){
tv2.setText(datas[i+1]);
}else {
tv2.setVisibility(View.GONE);
}
vf.addView(v); //把需要滚动布局添加到ViewFlipper
}
vf.startFlipping(); //开始滚动
}
布局文件：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:tools="http://schemas.android.com/tools">
<ImageView
android:id="@+id/iv"
android:layout_width="45dp"
android:layout_height="45dp"
android:src="@mipmap/icon"
/>
<TextView
android:id="@+id/tv1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:text="@string/app_name"
android:textColor="#fd6300"
android:lines="1"
android:layout_toRightOf="@id/iv"
android:paddingLeft="12dp"
/>
<TextView
android:id="@+id/tv2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:text="@string/app_name"
android:textColor="#fd6300"
android:layout_toRightOf="@id/iv"
android:paddingLeft="12dp"
android:lines="1"
android:layout_below="@id/tv1"
android:layout_marginTop="8dp"
/> </RelativeLayout>
很容易看懂的，轻松完成；
属性介绍:
android:autoStart： 设置自动加载下一个View
android:flipInterval：设置View之间切换的时间间隔
android:inAnimation： 设置切换View的进入动画
android:outAnimation：设置切换View的退出动画
方法介绍：
isFlipping： 判断View切换是否正在进行
setFilpInterval：设置View之间切换的时间间隔
startFlipping： 开始View的切换，而且会循环进行
stopFlipping： 停止View的切换
setOutAnimation：设置切换View的退出动画
setInAnimation： 设置切换View的进入动画
showNext： 显示ViewFlipper里的下一个View
showPrevious： 显示ViewFlipper里的上一个View
随便抽取一下，方便使用：
public class UpView extends ViewFlipper {
private Context content;
public UpView(Context context) {
super(context);
init(context);
}
private int Interval = 3000;
public UpView(Context context, AttributeSet attrs) {
super(context, attrs);
init(context);
}
private void init(Context context) {
this.content = context;
setFlipInterval(Interval);//设置时间间隔
setInAnimation(context,R.anim.in);
setOutAnimation(context,R.anim.out);
}
public void setInterval(int i){
Interval = i;
}
/**
* 设置循环滚动的View数组
*/
public void setViews(final List<View> views) {
if (views == null || views.size() == 0) return;
removeAllViews();
for ( int i = 0; i < views.size(); i++) {
final int finalposition=i;
//设置监听回调
views.get(i).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (onItemClickListener != null) {
onItemClickListener.onItemClick(finalposition, views.get(finalposition));
}
}
});
addView(views.get(i));
}
startFlipping();
}
private OnItemClickListener onItemClickListener;
public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
this.onItemClickListener = onItemClickListener;
}
public interface OnItemClickListener {
void onItemClick(int position, View view);
}
}
使用：
public class MainActivity extends AppCompatActivity implements UpView.OnItemClickListener {
private UpView vf;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
vf = findViewById(R.id.vf);
setData();
vf.setOnItemClickListener(this);
}
String datas[] = {
"鹿皮绒高腰小西装裤子女九分阔腿裤侧边条纹"
,"显瘦休闲运动裤女春秋薄款直筒长裤宽松卫裤"
,"春季浅色格子裤女九分裤松紧腰捆绳宽松显瘦千鸟格哈伦休闲裤"
,"秋冬新款宽松毛呢小脚哈伦裤休闲裤女显瘦呢子长裤加厚款大码潮"
,"春秋季新款心型碎花松紧腰长袖中长款连衣裙女宽松显瘦波点裙"
,"运动服套装女春秋时尚2018新款修身韩版卫衣春季休闲跑步两件套潮"
,"职业装女装套装时尚西装连衣裙ol气质工作服女春秋正装套装裙"
,"秋季卫衣女韩版学生百搭上衣宽松显瘦连帽2017时尚新款长袖外套潮"};
private void setData() {
List<View> views = new ArrayList<>();
for (int i = 0; i < datas.length; i= i+2) { //一次遍历两条数据
View v = View.inflate(this,R.layout.item,null);
TextView tv1 = v.findViewById(R.id.tv1);
TextView tv2 = v.findViewById(R.id.tv2);
tv1.setText(datas[i]);
if (datas.length > i+1){
tv2.setText(datas[i+1]);
}else {
tv2.setVisibility(View.GONE);
}
views.add(v);
}
vf.setViews(views);
}
@Override
public void onItemClick(int position, View view) {
Log.i("TAG",position+"");
}
}