Android ViewFlipper构建轮番公告

2018-08-09  本文已影响0人  有没有口罩给我一个

这节要讲一下项目中使用ViewFlipper构建公告轮番,使用了ViewFlipper,具体介绍去看官方文档。

首先看一下布局吧:
<?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="@dimen/news_height"
android:background="@drawable/corner_news_bg"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingBottom="@dimen/common_padding_small"
android:paddingLeft="@dimen/common_padding_middle"
android:paddingTop="@dimen/common_padding_small">

<ImageView
    style="@style/WrapMatch"
    android:layout_marginRight="@dimen/common_margin_middle"
    android:src="@drawable/icon_news" />

<View
    style="@style/DividerFixedWidth"
    android:layout_marginRight="@dimen/common_margin_middle" />

<ViewFlipper
    android:id="@+id/mFlipperView"
    style="@style/MatchWrap"
    android:flipInterval="3000" />
</LinearLayout>

动画,因为ViewFlipper,需要使用:
news_bottom_in:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
       android:duration="500"
       android:fromYDelta="100.0%p"
       android:toYDelta="0.0"/>

news_bottom_out:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="500"
       android:fromYDelta="0.0"
       android:toYDelta="-100.0%p"/>

具体的代码实现:

/*
公告轮番
 */
class NewsFlipperView @JvmOverloads constructor(
    context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
) : FrameLayout(context, attrs, defStyleAttr) {
private val mFlipperView: ViewFlipper

init {
    val rootView = View.inflate(context, R.layout.layout_news_flipper, this)
    mFlipperView = rootView.find(R.id.mFlipperView)
    mFlipperView.setInAnimation(context, R.anim.news_bottom_in)
    mFlipperView.setOutAnimation(context, R.anim.news_bottom_out)
}

/*
    构建公告内容
 */
fun buildNewsView(text: String): TextView {
    val textView = TextView(context)
    textView.text = text
    textView.textSize = px2sp(dimen(R.dimen.text_small_size))
    textView.layoutParams = LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT)
    return textView
}

/*
    设置公告数据
 */
fun setData(data: Array<String>) {
    for (text in data) {
        mFlipperView.addView(buildNewsView(text))
    }
    mFlipperView.startFlipping()
}

}

其实也简单,就是根据数据,创建特定的View往ViewFlipper中添加,ViewFlipper会自动执行轮番,这里就不得不提Kotlin,这个Android官方第一语言,下周会总结一些自定义View和动画。

上一篇下一篇

猜你喜欢

热点阅读