LiveGiftLayout

Introduction: 一个带礼物面板的直播礼物连击效果
More: Author   ReportBugs   
Tags:

QQ 交流群:611902811,有兴趣的可以交流 博客地址

首先先上图
image

1:到GitHub 把项目 clone 到本地。

2: 把 giftlibrary 库依赖到你的项目中去

3:在你要显示的 xml 文件中添加展示礼物和礼物面板的地方 以项目中的 activity_gift1.xml 为例

<?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">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"
        android:src="@mipmap/ic_bg" />

    <LinearLayout
        android:id="@+id/ll_gift_parent"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="100dp"
        android:orientation="vertical">
    </LinearLayout>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="150dp"
        android:layout_alignParentRight="true"
        android:layout_height="300dp"/>

    <Button
        android:id="@+id/action"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="20dp"
        android:text="礼物面板显示/隐藏" />

    <CheckBox
        android:id="@+id/rb_currentStart"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/action"
        android:layout_centerHorizontal="true"
        android:textColor="@color/white"
        android:shadowColor="@color/black"
        android:shadowRadius="10"
        android:shadowDx="5"
        android:shadowDy="10"
        android:textSize="20sp"
        android:text="是否使用当前礼物数开始显示" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true">

        <Button
            android:id="@+id/btn_clear_gift"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="清除礼物" />

        <Button
            android:id="@+id/btn_reset_gift"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@id/btn_clear_gift"
            android:layout_toRightOf="@+id/btn_clear_gift"
            android:layout_toEndOf="@+id/btn_clear_gift"
            android:text="初始化礼物" />

        <Button
            android:id="@+id/btn_hide_gift"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="隐藏/显示礼物"
            android:layout_alignBottom="@id/btn_reset_gift"
            android:layout_toRightOf="@+id/btn_reset_gift"
            android:layout_toEndOf="@+id/btn_reset_gift" />
    </RelativeLayout>

    <LinearLayout
        android:id="@+id/bottom"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="vertical">

        <include layout="@layout/chat_tool_box" />

    </LinearLayout>

</RelativeLayout>

这里礼物面板可以使用 DialogFragment 来替代我这里。

4:在 activity 中找到控件后就可以初始化礼物模块了。

a.礼物面板

代码如下:
这里如果想使用本地的礼物图片直接使用
giftPanelControl.init(null);//这里如果为 null 则加载本地礼物图片

 GiftPanelControl giftPanelControl = new GiftPanelControl(this, mViewpager, mRecyclerView, mDotsLayout);
        giftPanelControl.init(giftModels);//这里如果为 null 则加载本地礼物图片
        giftPanelControl.setGiftListener(new GiftPanelControl.GiftListener() {
            @Override
            public void getGiftInfo(String giftPic, String giftName, String giftPrice) {
                mGifturl = giftPic;
                mGiftName = giftName;
                mGiftPrice = giftPrice;
            }
        });

这里的 giftPic 参数我传的是资源文件中图片的名称,你也可以传的是图片的 id。

b.展示礼物

这里的 setGiftLayout(false, giftParent, 3)方法,参数一:是否开启上面的礼物轨道消失后下面的礼物轨道会移上去模式,true 是开启,false 是关闭;
参数二:礼物控件的父容器
参数三:礼物轨道的数量。
setCustormAnim(new CustormAnim())方法,对礼物的动画可以进行扩展,可以在不修改源码的情况下定制属于你的效果。

final LinearLayout giftParent = (LinearLayout) findViewById(R.id.ll_gift_parent);
giftControl = new GiftControl(this);
giftControl.setGiftLayout(false, giftParent, 3)
        .setCustormAnim(new CustormAnim());//这里可以自定义礼物动画

c.显示礼物数量的面板

tvGiftNum.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(final View v) {
                showGiftDialog();
            }
        });

d.礼物面板中发送按钮发送礼物的操作

如果你想要从某个礼物数开始连击,你可以在 giftControl.loadGift(giftModel);前创建的 GiftModel 设置 setCurrentStart(true)和 setHitCombo(giftnum),
这样就可以实现了。
温馨提示:这里的 setCurrentStart()方法必须设置为 true,setHitCombo()方法才能生效哦。

btnGift.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (TextUtils.isEmpty(giftstr)) {
                    Toast.makeText(getApplication(), "你还没选择礼物呢", Toast.LENGTH_SHORT).show();
                } else {
                    String numStr = tvGiftNum.getText().toString();
                    if (!TextUtils.isEmpty(numStr)) {
                        int giftnum = Integer.parseInt(numStr);
                        if (giftnum == 0) {
                            return;
                        } else {
                            giftControl.loadGift(new GiftModel(giftstr, "安卓机器人", giftnum, "http://www.baidu.com", "123", "Lee123", "http://www.baidu.com"));
                        }
                    }
                }
            }
        });

e.简单的操作了横竖屏显示不同的面板

findViewById(R.id.action).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if (giftLayout.getVisibility() == View.VISIBLE) {
                    giftLayout.setVisibility(View.GONE);
                } else {
                    giftLayout.setVisibility(View.VISIBLE);
                }
            }
        });

f.类似于切换直播间可以重新发送礼物(切换效果没做,功能实现了)

findViewById(R.id.btn_clear_gift).setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        if (giftControl != null) {
            giftControl.cleanAll();
        }
    }
});
findViewById(R.id.btn_reset_gift).setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        giftControl.reSetGiftLayout(false, giftParent, 3);
    }
});

最后如果对你有用,请动动你的鼠标给个 start 或者 fork 吧,不胜感激

Apps
About Me
GitHub: Trinea
Facebook: Dev Tools