Android直播送禮物發(fā)消息頁(yè)面（仿印客直播）

簡(jiǎn)介

年關(guān)將至，給大家拜個(gè)早年，祝大家雞年大吉吧 ~ 哈哈有污的同學(xué)面壁去吧赦邻！閑話不多說(shuō)，今天實(shí)現(xiàn)的效果是直播的時(shí)候浮層View实檀，不知道直播的sdk是不是都提供UI這方面的東西惶洲。先看一張效果圖：

實(shí)現(xiàn)效果圖

主要實(shí)現(xiàn)效果：
（當(dāng)然直播的時(shí)候視頻是主要的，這里不關(guān)心視頻膳犹，重點(diǎn)是View恬吕，這里只是隨意播放了一個(gè)視頻。）

首先是頂部橫線滑動(dòng)的ListView顯示房間的成員须床；
ListView 自動(dòng)滾動(dòng)到底部铐料；
自定義實(shí)現(xiàn)刷禮物的View，過(guò)段時(shí)間自動(dòng)消失豺旬；
送禮物的時(shí)候彈出禮物的DialogFragment+ViewPager+GridView;
點(diǎn)擊評(píng)論的時(shí)候監(jiān)聽(tīng)彈出鍵盤(pán)的事件钠惩；
直播底部顯示送心的特效（這里用了第三方的 tyrant:heartlayout）；
VedioView播放視頻族阅；

實(shí)現(xiàn)過(guò)程

首先需要清楚視頻是出于最底部的篓跛，在視頻上面浮著View，這里我用了ViewPager來(lái)實(shí)現(xiàn)右滑”隱藏“View坦刀，其實(shí)是切換愧沟。
很簡(jiǎn)單布局：

<?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="match_parent"
    android:background="@drawable/wether_bg"
    android:orientation="vertical">
    <cm.wzh.live.view.MyVideoView
        android:id="@+id/video"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:background="@null"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </android.support.v4.view.ViewPager>
</RelativeLayout>

接下來(lái)實(shí)現(xiàn)2個(gè)Fragment蔬咬，一個(gè)是空白的Fragment（NoFragment ），一個(gè)是帶有各種特效的Fragment（ChatFragment ）沐寺，再填充到ViewPager里面去林艘，當(dāng)然這里還需要去實(shí)現(xiàn)視頻的播放，很簡(jiǎn)單的VedioView混坞，這里就不再多說(shuō)~

//從Raw資源文件讀取視頻
final String uri = ("android.resource://" + this.getPackageName() + "/raw/vedio");
videoView.setVideoURI(Uri.parse(uri));
videoView.start();
//視頻可以循環(huán)播放
videoView.setOnCompletionListener(new MediaPlayer.OnCompletionListener() {
    @Override
    public void onCompletion(MediaPlayer mp) {
        videoView.setVideoURI(Uri.parse(uri));
        videoView.start();
    }
});

接下來(lái)看主要的ChatFragment ：

package cm.wzh.live.ui;

import android.content.Context;
import android.graphics.Color;
import android.net.Uri;
import android.os.Bundle;
import android.os.Handler;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.inputmethod.InputMethodManager;
import android.widget.AdapterView;
import android.widget.EditText;
import android.widget.ListView;
import android.widget.VideoView;

import java.util.ArrayList;
import java.util.Random;
import java.util.Timer;

import cm.wzh.live.R;
import cm.wzh.live.adapter.MemberAdapter;
import cm.wzh.live.adapter.MessageAdapter;
import cm.wzh.live.entity.Gift;
import cm.wzh.live.entity.Member;
import cm.wzh.live.entity.Message;
import cm.wzh.live.utils.CharUtils;
import cm.wzh.live.view.FragmentDialog;
import cm.wzh.live.view.FragmentGiftDialog;
import cm.wzh.live.view.GiftItemView;
import cm.wzh.live.view.HorizontialListView;
import cm.wzh.live.view.MyVideoView;
import tyrantgit.widget.HeartLayout;

/**
 * author：Administrator on 2016/12/26 09:35
 * description:文件說(shuō)明
 * version:版本
 */
public class ChatFragment extends Fragment  implements View.OnClickListener, View.OnLayoutChangeListener {
    private HorizontialListView listview ;
    private ListView messageList ;
    private GiftItemView giftView ;
    private MemberAdapter mAdapter ;
    private MessageAdapter messageAdapter ;
    private ArrayList<Member> members ;
    private ArrayList<Message> messages ;
    private ArrayList<Gift> gifts ;
    private HeartLayout heartLayout ;
    private Random mRandom ;
    private Timer mTimer = new Timer();
    private View sendView,menuView ,topView;
    private EditText sendEditText ;
    //屏幕高度
    private int screenHeight = 0;
    //軟件盤(pán)彈起后所占高度閥值
    private int keyHeight = 0;
    private View rootView ;


    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        super.onCreateView(inflater, container, savedInstanceState);
        View view = LayoutInflater.from(getActivity()).inflate(R.layout.fragment_chat,null,false);
        initView(view);
        initData();
        return view;
    }

    private void initView(View view) {
        mRandom = new Random();
        listview = (HorizontialListView) view.findViewById(R.id.list);
        mAdapter = new MemberAdapter(getActivity());
        listview.setAdapter(mAdapter);
        listview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                 showDialog(mAdapter.datas.get(i));
            }
        });
        messageList = (ListView) view.findViewById(R.id.list_message);
        messageAdapter = new MessageAdapter(getActivity());
        messageList.setAdapter(messageAdapter);
        giftView = (GiftItemView) view.findViewById(R.id.gift_item_first);
        heartLayout = (HeartLayout)view.findViewById(R.id.heart_layout);
        handler.postDelayed(runnable, 2000);//每5秒執(zhí)行一次runnable.
        view.findViewById(R.id.send_message).setOnClickListener(this);
        view.findViewById(R.id.gift).setOnClickListener(this);
        sendView = view.findViewById(R.id.layout_send_message);
        menuView = view.findViewById(R.id.layout_bottom_menu);
        topView = view.findViewById(R.id.layout_top);
        sendEditText = (EditText) view.findViewById(R.id.send_edit);
        //獲取屏幕高度
        screenHeight = getActivity().getWindowManager().getDefaultDisplay().getHeight();
        //閥值設(shè)置為屏幕高度的1/3
        keyHeight = screenHeight/3;
        rootView = view.findViewById(R.id.activity_main);
        rootView.addOnLayoutChangeListener(this);
    }

    private void showDialog(Member m) {
        FragmentDialog.newInstance(m.name, m.sig, "確定", "取消",-1,false, new FragmentDialog.OnClickBottomListener() {
            @Override
            public void onPositiveClick() {

            }

            @Override
            public void onNegtiveClick() {

            }
        }).show(getChildFragmentManager(),"dialog");

    }

    Handler handler=new Handler();
    Runnable runnable=new Runnable() {
        @Override
        public void run() {
            if (messages!=null){
                Message m = new Message();
                m.img = "http://v1.qzone.cc/avatar/201503/06/18/27/54f981200879b698.jpg%21200x200.jpg" ;
                m.name=CharUtils.getRandomString(8) ;
                m.level = (int)(Math.random()*100+1) ;
                m.message= CharUtils.getRandomString(20);
                messages.add(m);
                messageAdapter.notifyDataSetChanged();
                messageList.setSelection(messageAdapter.getCount()-1);
            }
            handler.postDelayed(this, 1000);
        }
    };
    Handler heartHandler=new Handler();
    Runnable heartRunnable=new Runnable() {
        @Override
        public void run() {
            heartLayout.post(new Runnable() {
                @Override
                public void run() {
                    heartLayout.addHeart(randomColor());
                }
            });
            heartHandler.postDelayed(this, 1000);
        }
    };

    @Override
    public void onPause() {
        super.onPause();
        heartHandler.removeCallbacks(heartRunnable);
    }

    @Override
    public void onResume() {
        super.onResume();
        heartHandler.postDelayed(heartRunnable, 2000);
    }

    private int randomColor() {
        return Color.rgb(mRandom.nextInt(255), mRandom.nextInt(255), mRandom.nextInt(255));
    }
    /**
     * 添加一些數(shù)據(jù)
     */
    private void initData() {
        members = new ArrayList<>();
        for (int i=0;i<18;i++){
            Member m = new Member();
            m.img = "http://www.ld12.com/upimg358/allimg/c150808/143Y5Q9254240-11513_lit.png" ;
            m.name="Baby" ;
            m.sig = "這個(gè)家伙很懶狐援，什么都沒(méi)留下！";
            members.add(m);
        }
        mAdapter.setDatas(members);


        messages = new ArrayList<>();
        for (int i=0;i<18;i++){
            Message m = new Message();
            m.img = "http://www.ld12.com/upimg358/allimg/c150808/143Y5Q9254240-11513_lit.png" ;
            m.name="Baby" ;
            m.level = i ;
            m.message="掘金是中國(guó)質(zhì)量最高的技術(shù)分享社區(qū),邀請(qǐng)稀土用戶作為 Co-Editor 來(lái)分享優(yōu)質(zhì)的技術(shù)干貨" ;
            messages.add(m);
        }
        messageAdapter.setDatas(messages);

        gifts = new ArrayList<>();
    }

    @Override
    public void onDestroy() {
        super.onDestroy();
        mTimer.cancel();
        handler.removeCallbacks(runnable);
    }

    @Override
    public void onClick(View v) {
        int id = v.getId() ;
        if (id==R.id.send_message){
            sendView.setVisibility(View.VISIBLE);
            menuView.setVisibility(View.GONE);
            topView.setVisibility(View.GONE);
            sendEditText.requestFocus();
            InputMethodManager inputManager =
                    (InputMethodManager)sendEditText.getContext().getSystemService(Context.INPUT_METHOD_SERVICE);
            inputManager.showSoftInput(sendEditText, 0);
        }else if (id==R.id.gift){
            FragmentGiftDialog.newInstance().setOnGridViewClickListener(new FragmentGiftDialog.OnGridViewClickListener() {
                @Override
                public void click(Gift gift) {
                    gift.name="文人騷客";
                    gift.giftName = "送你一個(gè)小禮物" ;
                    if (!gifts.contains(gift)){
                        gifts.add(gift);
                        giftView.setGift(gift);
                    }
                    giftView.addNum(1);
                }
            }).show(getChildFragmentManager(),"dialog");
        }
    }

    @Override
    public void onLayoutChange(View v, int left, int top, int right, int bottom, int oldLeft, int oldTop, int oldRight, int oldBottom) {
        //現(xiàn)在認(rèn)為只要控件將Activity向上推的高度超過(guò)了1/3屏幕高究孕，就認(rèn)為軟鍵盤(pán)彈起
        if(oldBottom != 0 && bottom != 0 &&(oldBottom - bottom > keyHeight)){
            sendView.setVisibility(View.VISIBLE);
            menuView.setVisibility(View.GONE);
            topView.setVisibility(View.GONE);
//            Toast.makeText(MainActivity.getActivity(), "監(jiān)聽(tīng)到軟鍵盤(pán)彈起...", Toast.LENGTH_SHORT).show();
        }else if(oldBottom != 0 && bottom != 0 &&(bottom - oldBottom > keyHeight)){
            sendView.setVisibility(View.GONE);
            menuView.setVisibility(View.VISIBLE);
            topView.setVisibility(View.VISIBLE);
//            Toast.makeText(MainActivity.getActivity(), "監(jiān)聽(tīng)到軟件盤(pán)關(guān)閉...", Toast.LENGTH_SHORT).show();
        }
    }
}

這里可以看到咕村，已經(jīng)把刷禮物的View封裝成了 GiftItemView 。

package cm.wzh.live.view;

import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.content.Context;
import android.os.Handler;
import android.text.TextUtils;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.LinearInterpolator;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.bumptech.glide.Glide;

import java.util.ArrayList;

import cm.wzh.live.R;
import cm.wzh.live.entity.Gift;

/**
 * author：Administrator on 2016/12/27 09:34
 * description:文件說(shuō)明
 * version:版本
 */
public class GiftItemView extends LinearLayout {

    private ImageView avatar ;
    private TextView name ;
    private TextView giftName ;
    private TextView giftNumTv ;
    private ImageView giftIv ;
    private Gift gift ;

    private int giftNum = 1 ;
    private boolean isShow = false ;

    public GiftItemView(Context context) {
        this(context,null);
    }

    public GiftItemView(Context context, AttributeSet attrs) {
        this(context, attrs,0);
    }

    public GiftItemView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        setOrientation(VERTICAL);
        setVisibility(INVISIBLE);
        LayoutParams lp = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        setLayoutParams(lp);
        View convertView = LayoutInflater.from(getContext()).inflate(R.layout.item_gift_message,null,false);
        avatar = (ImageView) convertView.findViewById(R.id.avatar);
        giftIv = (ImageView) convertView.findViewById(R.id.gift_type);
        name = (TextView) convertView.findViewById(R.id.name);
        giftName = (TextView) convertView.findViewById(R.id.gift_name);
        giftNumTv = (TextView) convertView.findViewById(R.id.gift_num);
        addView(convertView);
    }

    public void setGift(Gift gift) {
        this.gift = gift;
        refreshView();
    }

    /**
     * 設(shè)置禮物數(shù)量放大和復(fù)原的View
     * @param view
     * @param duration
     */
    public void scaleView(View view,long duration){
        AnimatorSet animatorSet = new AnimatorSet();//組合動(dòng)畫(huà)
        ObjectAnimator scaleX = ObjectAnimator.ofFloat(view, "scaleX", 2f, 1f);
        ObjectAnimator scaleY = ObjectAnimator.ofFloat(view, "scaleY", 2f, 1f);
        animatorSet.setDuration(duration);
        animatorSet.setInterpolator(new LinearInterpolator());
        animatorSet.play(scaleY).with(scaleX);//兩個(gè)動(dòng)畫(huà)同時(shí)開(kāi)始
        animatorSet.start();
        animatorSet.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
                if (onAnimatorListener!=null){
                    onAnimatorListener.onAnimationEnd(gift);
                }
            }

            @Override
            public void onAnimationStart(Animator animation) {
                super.onAnimationStart(animation);
                if (onAnimatorListener!=null){
                    onAnimatorListener.onAnimationStart(animation);
                }
            }
        });
    }

    /**
     * 刷新view
     */
    public void refreshView(){
        if (gift==null){
            return;
        }
        giftNum = gift.num ;
        if (!TextUtils.isEmpty(gift.img)){
            Glide.with(getContext()).load(gift.img).placeholder(R.drawable.default_head).into(avatar);
        }else {
            avatar.setImageResource(R.drawable.default_head);
        }
        name.setText(gift.name);
        giftName.setText(gift.giftName);
        giftNumTv.setText("x"+gift.num);
        giftIv.setImageResource(gift.giftType);
        scaleView(giftNumTv,200);
    }

    /**
     * 連續(xù)點(diǎn)擊送禮物的時(shí)候數(shù)字縮放效果
     * @param num
     */
    public void addNum(int num){
        giftNum += num ;
        giftNumTv.setText("x"+giftNum);
        scaleView(giftNumTv,200);
        handler.removeCallbacks(runnable);
        if (!isShow()){
            show();
        }
        handler.postDelayed(runnable, 3000);
    }
    Handler handler=new Handler();
    Runnable runnable=new Runnable() {
        @Override
        public void run() {
            isShow = false ;
            giftNum = 0;
            setVisibility(INVISIBLE);
        }
    };

    /**
     * 顯示view蚊俺，并開(kāi)啟定時(shí)器
     */
    public void show(){
        isShow = true ;
        setVisibility(VISIBLE);
        handler.postDelayed(runnable, 3000);
    }

    public boolean isShow() {
        return isShow;
    }

    private OnAnimatorListener onAnimatorListener ;

    public void setOnAnimatorListener(OnAnimatorListener onAnimatorListener) {
        this.onAnimatorListener = onAnimatorListener;
    }

    public interface OnAnimatorListener{
        public void onAnimationEnd(Gift gift);
        public void onAnimationStart(Animator animation);
    }
}

主要是Handler+Runnable實(shí)現(xiàn)定時(shí)任務(wù)懈涛，當(dāng)連續(xù)送禮物的時(shí)候再重新計(jì)時(shí)，用屬性動(dòng)畫(huà)ObjectAnimator對(duì)送的數(shù)字縮放動(dòng)畫(huà)泳猬。
對(duì)于ListView自動(dòng)滾動(dòng)是定時(shí)任務(wù)每來(lái)一個(gè)Item就加到ListView集合里面批钠，然后用listview.setSelection(int adapter.getCount())定位到最后一個(gè)Item。

有興趣的可以看一下源代碼： github下載地址 github上有apk文件可以下載體驗(yàn)下得封。
如果有什么問(wèn)題埋心，希望大家指出來(lái)，謝謝~

最后編輯于：2017.12.05 06:22:25

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者

人面猴
序言：七十年代末忙上，一起剝皮案震驚了整個(gè)濱河市拷呆，隨后出現(xiàn)的幾起案子，更是在濱河造成了極大的恐慌疫粥，老刑警劉巖茬斧，帶你破解...
沈念sama閱讀 210,978評(píng)論 6贊 490
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件，死亡現(xiàn)場(chǎng)離奇詭異梗逮，居然都是意外死亡项秉，警方通過(guò)查閱死者的電腦和手機(jī)，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 89,954評(píng)論 2贊 384
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進(jìn)店門慷彤，熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)娄蔼，“玉大人，你說(shuō)我怎么就攤上這事底哗∷晁撸” “怎么了？”我有些...
開(kāi)封第一講書(shū)人閱讀 156,623評(píng)論 0贊 345
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵跋选，是天一觀的道長(zhǎng)涕癣。經(jīng)常有香客問(wèn)我，道長(zhǎng)野建，這世上最難降的妖魔是什么属划？我笑而不...
開(kāi)封第一講書(shū)人閱讀 56,324評(píng)論 1贊 282
?港島之戀（遺憾婚禮）
正文為了忘掉前任，我火速辦了婚禮候生，結(jié)果婚禮上同眯，老公的妹妹穿的比我還像新娘。我一直安慰自己唯鸭，他們只是感情好须蜗，可當(dāng)我...
茶點(diǎn)故事閱讀 65,390評(píng)論 5贊 384
惡毒庶女頂嫁案：這布局不是一般人想出來(lái)的
文/花漫我一把揭開(kāi)白布。她就那樣靜靜地躺著目溉，像睡著了一般明肮。火紅的嫁衣襯著肌膚如雪。梳的紋絲不亂的頭發(fā)上缭付，一...
開(kāi)封第一講書(shū)人閱讀 49,741評(píng)論 1贊 289
城市分裂傳說(shuō)
那天柿估，我揣著相機(jī)與錄音，去河邊找鬼陷猫。笑死秫舌，一個(gè)胖子當(dāng)著我的面吹牛，可吹牛的內(nèi)容都是我干的绣檬。我是一名探鬼主播足陨，決...
沈念sama閱讀 38,892評(píng)論 3贊 405
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開(kāi)眼，長(zhǎng)吁一口氣：“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼娇未！你這毒婦竟也來(lái)了墨缘？” 一聲冷哼從身側(cè)響起，我...
開(kāi)封第一講書(shū)人閱讀 37,655評(píng)論 0贊 266
萬(wàn)榮殺人案實(shí)錄
序言：老撾萬(wàn)榮一對(duì)情侶失蹤零抬，失蹤者是張志新（化名）和其女友劉穎镊讼，沒(méi)想到半個(gè)月后，有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體平夜，經(jīng)...
沈念sama閱讀 44,104評(píng)論 1贊 303
?護(hù)林員之死
正文獨(dú)居荒郊野嶺守林人離奇死亡狠毯，尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛以下內(nèi)容為張勛視角年9月15日...
茶點(diǎn)故事閱讀 36,451評(píng)論 2贊 325
?白月光啟示錄
正文我和宋清朗相戀三年，在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了褥芒。大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片嚼松。...
茶點(diǎn)故事閱讀 38,569評(píng)論 1贊 340
活死人
序言：一個(gè)原本活蹦亂跳的男人離奇死亡，死狀恐怖锰扶，靈堂內(nèi)的尸體忽然破棺而出献酗，到底是詐尸還是另有隱情，我是刑警寧澤坷牛，帶...
沈念sama閱讀 34,254評(píng)論 4贊 328
?日本核電站爆炸內(nèi)幕
正文年R本政府宣布罕偎，位于F島的核電站，受9級(jí)特大地震影響京闰，放射性物質(zhì)發(fā)生泄漏颜及。R本人自食惡果不足惜甩苛，卻給世界環(huán)境...
茶點(diǎn)故事閱讀 39,834評(píng)論 3贊 312
男人毒藥：我在死后第九天來(lái)索命
文/蒙蒙一、第九天我趴在偏房一處隱蔽的房頂上張望俏站。院中可真熱鬧讯蒲，春花似錦、人聲如沸肄扎。這莊子的主人今日做“春日...
開(kāi)封第一講書(shū)人閱讀 30,725評(píng)論 0贊 21
一樁弒父案，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽(yáng)犯祠。三九已至旭等，卻和暖如春，著一層夾襖步出監(jiān)牢的瞬間衡载，已是汗流浹背搔耕。一陣腳步聲響...
開(kāi)封第一講書(shū)人閱讀 31,950評(píng)論 1贊 264
情欲美人皮
我被黑心中介騙來(lái)泰國(guó)打工，沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留痰娱，地道東北人度迂。一個(gè)月前我還...
沈念sama閱讀 46,260評(píng)論 2贊 360
代替公主和親
正文我出身青樓，卻偏偏與公主長(zhǎng)得像猜揪，于是被迫代替她去往敵國(guó)和親惭墓。傳聞我的和親對(duì)象是個(gè)殘疾皇子，可洞房花燭夜當(dāng)晚...
茶點(diǎn)故事閱讀 43,446評(píng)論 2贊 348

Android直播送禮物發(fā)消息頁(yè)面（仿印客直播）

簡(jiǎn)介

實(shí)現(xiàn)過(guò)程

推薦閱讀更多精彩內(nèi)容