Androidカスタムビュー——BarrageView弾幕機能を実現

今では多くのアプリケーションに弾幕の機能があり、本人は弾幕の機能を使うことに興味はありませんが、この弾幕の機能をどのように実現するかに興味があります.まず効果図を載せる.
げんり
プロパティが異なるTextViewをViewGroupに不定期に追加して、異なるアニメーションを実行します.
BarrageViewのキーコード
BarrageViewに必要なプロパティ

 /** *         */
    private int maxSpeed;
    /** *         */
    private int minSpeed;
    /** *         */
    private float maxTextSize;
    /** *         */
    private float minTextSize;
    /** *         */
    private int maxInterval;
    /** *         */
    private int minInterval;
    /** *            */
    private Random random = new Random();
    /** *        */
    private boolean barrageState = true;

コントロールをより便利に使用するためにattrs.xmlでコントロールを追加するために必要なカスタムプロパティ

  <declare-styleable name="BarrageView">
        <attr name="maxSpeed" format="integer"/>
        <attr name="minSpeed" format="integer"/>
        <attr name="maxInterval" format="integer"/>
        <attr name="minInterval" format="integer"/>
        <attr name="maxTextSize" format="dimension"/>
        <attr name="minTextSize" format="dimension"/>
    </declare-styleable>

コンストラクション関数でカスタム属性の値を取得するには

 TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.BarrageView, defStyleAttr, 0);
        minSpeed =a.getInt(R.styleable.BarrageView_minSpeed,7000);
        maxSpeed =a.getInt(R.styleable.BarrageView_maxSpeed,4000);
        maxTextSize = a.getDimension(R.styleable.BarrageView_maxTextSize, 30);
        minTextSize = a.getDimension(R.styleable.BarrageView_minTextSize, 10);
        maxInterval = a.getInteger(R.styleable.BarrageView_maxInterval, 2000);
        minInterval = a.getInteger(R.styleable.BarrageView_minInterval, 500);
        a.recycle();

BarrageViewでは、弾幕を制御するためにHandlerを定義する必要があります.

 private static final int MESSAGE_SHOWITEM = 1;

    private Handler barrageHandler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            if (msg.what == 1) {
                if(barrageState) {
                    addBarrageItem();
                    //        
                    int interval = (int) (Math.random() * (maxInterval - minInterval) + minInterval);
                    sendEmptyMessageDelayed(MESSAGE_SHOWITEM, interval);
                }
            }
        }
    };

弾幕の追加方法

 /** *      */
    private void addBarrageItem() {
        final TextView textView = new TextView(getContext());
        int textSize = (int) (Math.random() * (maxTextSize - minTextSize) + minTextSize);
        textView.setTextSize(textSize);
        textView.setSingleLine(true);
        //        
        textView.setTextColor(0xff000000 | random.nextInt(0x00ffffff));
        textView.setText(barrageContents.get((int) (Math.random() * barrageContents.size())));
        //  measure  measuredHeight measuredWidth    
        textView.measure(0, 0);
        int speed = (int) (Math.random() * (maxSpeed - minSpeed) + minSpeed);
        int topMargin = (int) (Math.random() * (this.getHeight() - textView.getMeasuredHeight()));
        LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        params.addRule(RelativeLayout.ALIGN_PARENT_TOP);
        params.topMargin = topMargin;
        this.addView(textView, params);
        TranslateAnimation anim = new TranslateAnimation(this.getWidth(), -textView.getMeasuredWidth(), 0, 0);
        anim.setDuration(speed);
        anim.setFillAfter(true);
        textView.startAnimation(anim);
        anim.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
            }

            @Override
            public void onAnimationEnd(Animation animation) {
                textView.clearAnimation();
                BarrageView.this.removeView(textView);
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
            }
        });

    }

弾幕の内容を設定する

  /** *        * * @param barrageContents      */
    public void setBarrageContents(List<String> barrageContents) {
        this.removeAllViews();//       
        barrageHandler.removeMessages(MESSAGE_SHOWITEM);///       

        this.barrageContents = barrageContents;
        barrageHandler.sendEmptyMessageDelayed(MESSAGE_SHOWITEM, 0);
    }

コントロール弾幕

/** *      */
    public void startBarraging(){
        barrageState = true;
        if(!barrageHandler.hasMessages(MESSAGE_SHOWITEM)){
            barrageHandler.sendEmptyMessage(MESSAGE_SHOWITEM);
        }
    }

    /** *      */
    public void stopBarraging(){
        barrageState = false;
        barrageHandler.removeMessages(MESSAGE_SHOWITEM);
    }

最後にレイアウトコードの例

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent">

    <com.xiaoniu.barragedemo.BarrageView  android:id="@+id/barrageView" android:layout_width="match_parent" android:layout_height="300dp" android:background="#b1b1b1" app:maxInterval="1000" app:minInterval="500" app:maxSpeed="3000" app:minSpeed="5000" app:maxTextSize="20sp" app:minTextSize="10sp"/>
</RelativeLayout>

————————————————————
ソースアドレス