Android to achieve the cool of the network live Pinball function _android

Now the network broadcast more and more fire, network anchor has gradually become a new career, for the webcast, the function of the screen is necessary, the following figure:

First of all, to analyze this screen function is how to achieve, first of all at the bottom is definitely a game interface view, and then the game screen view, Play screen view must be made completely transparent, so even if the top of the game interface will not affect the normal game to watch, Only when someone sends a barrage message, then the message is drawn to the view of the bomb screen can be, there is certainly a view of the operation interface, you can let users to send a bomb screen and gift-giving function, schematic diagram as shown below:

The following step-by-step implementation of this function is achieved by referring to the schematic diagram.

To achieve video playback

Activity_main.xml

<relativelayout 
  xmlns:android= "http://schemas.android.com/apk/res/android" 
  android:id= "@+id/ Activity_main " 
  android:layout_width=" match_parent " 
  android:layout_height=" Match_parent " 
  android: background= "#000" > 
 
  <videoview 
    android:id= "@+id/video_view android:layout_width=" Match_ 
    Parent " 
    android:layout_height=" wrap_content " 
    android:layout_centerinparent=" true "/> 
</ Relativelayout> 

Mainactivity.java

Package com.jackie.bombscreen; 
Import Android.os.Build; 
Import Android.os.Bundle; 
Import android.os.Environment; 
Import android.support.v7.app.AppCompatActivity; 
Import Android.view.View; 
 
Import Android.widget.VideoView;  
    public class Mainactivity extends appcompatactivity {@Override protected void onCreate (Bundle savedinstancestate) { 
    Super.oncreate (savedinstancestate); 
    Setcontentview (R.layout.activity_main); 
    Videoview Videoview = (videoview) Findviewbyid (R.id.video_view); 
    Videoview.setvideopath (Environment.getexternalstoragedirectory () + "/xiaoxingyun.mp4"); 
  Videoview.start (); 
    @Override public void Onwindowfocuschanged (Boolean hasfocus) {super.onwindowfocuschanged (hasfocus); 
      if (Hasfocus && Build.VERSION.SDK_INT >=) {View Decorview = GetWindow (). Getdecorview (); Decorview.setsystemuivisibility (view.system_ui_flag_layout_stable | View.system_ui_flag_layout_hide_navigation | View.system_ui_flag_layout_fullscreen | view.system_ui_flag_hide_navigation | View.system_ui_flag_fullscreen | 
    View.system_ui_flag_immersive_sticky); 
 } 
  } 
}

Finally, don't forget to set androidmainfest.xml.

The effect is as follows:

To achieve the effect of the bomb screen

Next we start to achieve the effect of the play screen. The screen is actually a custom view, which can display a text effect similar to a marquee. Comments from viewers will be displayed on the screen, but they will move quickly out of the picture, which can play an interactive role without affecting the normal viewing of the video.

We can write this custom view on our own, and of course we can directly use open source projects on the web. So in order to be able to achieve the effect of the screen quickly and easily, I am prepared to use the danmakuflamemaster of the open source of the bomb screen from the beep-mile.

Danmakuflamemaster Library's Project home address is: Https://github.com/Bilibili/DanmakuFlameMaster

Add Build.gradle Dependencies

Compile ' com.github.ctiao:danmakuflamemaster:0.5.3 '

<?xml version= "1.0" encoding= "Utf-8"?> <relativelayout xmlns:android= 
  "http://" Schemas.android.com/apk/res/android " 
  android:id=" @+id/activity_main " 
  android:layout_width=" Match_ Parent " 
  android:layout_height=" match_parent " 
  android:background=" #000 "> 
 
  <videoview 
    Android:id= "@+id/video_view" 
    android:layout_width= "match_parent" 
    android:layout_height= "Wrap_content" 
    android:layout_centerinparent= "true"/> 
 
  <master.flame.danmaku.ui.widget.danmakuview 
    Android:id= "@+id/danmaku_view" 
    android:layout_width= "match_parent" 
    android:layout_height= "Match_" Parent "/> 
</RelativeLayout> 

Modify Mainactivity.java

Package com.jackie.bombscreen; 
Import Android.graphics.Color; 
Import Android.os.Build; 
Import Android.os.Bundle; 
Import android.os.Environment; 
Import android.support.v7.app.AppCompatActivity; 
Import Android.view.View; 
 
Import Android.widget.VideoView; 
 
Import Java.util.Random; 
Import Master.flame.danmaku.controller.DrawHandler; 
Import Master.flame.danmaku.danmaku.model.BaseDanmaku; 
Import Master.flame.danmaku.danmaku.model.DanmakuTimer; 
Import Master.flame.danmaku.danmaku.model.IDanmakus; 
Import Master.flame.danmaku.danmaku.model.android.DanmakuContext; 
Import Master.flame.danmaku.danmaku.model.android.Danmakus; 
Import Master.flame.danmaku.danmaku.parser.BaseDanmakuParser; 
 
Import Master.flame.danmaku.ui.widget.DanmakuView; 
  public class Mainactivity extends Appcompatactivity {private Boolean Misshowdanmaku; 
  Private Danmakuview Mdanmakuview; 
 
  Private Danmakucontext Mdanmakucontext; Private Basedanmakuparser parser = new Basedanmakuparser () {@OVerride protected Idanmakus Parse () {return new Danmakus (); 
 
  } 
  }; 
    @Override protected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); 
    Setcontentview (R.layout.activity_main); 
    Videoview Videoview = (videoview) Findviewbyid (R.id.video_view); 
    Videoview.setvideopath (Environment.getexternalstoragedirectory () + "/xiaoxingyun.mp4"); 
 
    Videoview.start (); 
    Mdanmakuview = (Danmakuview) Findviewbyid (R.id.danmaku_view); 
    Mdanmakuview.enabledanmakudrawingcache (TRUE); Mdanmakuview.setcallback (New Drawhandler.callback () {@Override public void prepared () {Misshowdan 
        Maku = true; 
        Mdanmakuview.start (); 
      Generatesomedanmaku ();  @Override public void Updatetimer (Danmakutimer timer) {} @Override public void 
Danmakushown (Basedanmaku danmaku) {} @Override public void drawingfinished () {}    }); 
    Mdanmakucontext = Danmakucontext.create (); 
  Mdanmakuview.prepare (parser, Mdanmakucontext); /** * Add a bullet screen to the view of the barrage * @param content of the contents of the barrage * @param withborder shells have a border * * private void AD Ddanmaku (String content, Boolean withborder) {Basedanmaku Danmaku = MDanmakuContext.mDanmakuFactory.createDanmaku (Ba 
    SEDANMAKU.TYPE_SCROLL_RL); 
    Danmaku.text = content; 
    danmaku.padding = 5; 
    Danmaku.textsize = sp2px (20); 
    Danmaku.textcolor = Color.White; 
    Danmaku.settime (Mdanmakuview.getcurrenttime ()); 
    if (withborder) {danmaku.bordercolor = Color.green; 
  } mdanmakuview.adddanmaku (Danmaku); /** * Randomly generated some bullet screen content for testing/private void Generatesomedanmaku () {New Thread (new Runnable () {@Ov 
          Erride public void Run () {while (Misshowdanmaku) {int time = new Random (). Nextint (300); 
          String content = "" + Time + time; Adddanmaku (content, false); 
          try {thread.sleep (time); 
          catch (Interruptedexception e) {e.printstacktrace (); 
  }}}). Start (); 
   }/** * SP to px method. 
    * * public int sp2px (float spvalue) {final float Fontscale = getresources (). Getdisplaymetrics (). scaleddensity; 
  return (int) (Spvalue * fontscale + 0.5f); 
    } @Override protected void OnPause () {super.onpause (); 
    if (Mdanmakuview!= null && mdanmakuview.isprepared ()) {mdanmakuview.pause (); 
    }} @Override protected void Onresume () {super.onresume (); if (Mdanmakuview!= null && mdanmakuview.isprepared () && mdanmakuview.ispaused ()) {Mdanmakuview.re 
    Sume (); 
    }} @Override protected void OnDestroy () {Super.ondestroy (); 
    Misshowdanmaku = false; 
      if (Mdanmakuview!= null) {mdanmakuview.release (); 
    Mdanmakuview = null; }} @OverriDe public void onwindowfocuschanged (Boolean hasfocus) {super.onwindowfocuschanged (hasfocus); 
      if (Hasfocus && Build.VERSION.SDK_INT >=) {View Decorview = GetWindow (). Getdecorview (); Decorview.setsystemuivisibility (view.system_ui_flag_layout_stable | view.system_ui_flag_layout_hide_navigation | View.system_ui_flag_layout_fullscreen | view.system_ui_flag_hide_navigation | View.system_ui_flag_fullscreen | 
    View.system_ui_flag_immersive_sticky); 
 } 
  } 
}

The effect chart is as follows:

Join the Operator interface

<?xml version= "1.0" encoding= "Utf-8"?> <relativelayout xmlns:android= "http://schemas.android.com/apk/res/"  
  Android "android:id=" @+id/activity_main "android:layout_width=" match_parent "android:layout_height=" Match_parent " android:background= "#000" > <videoview android:id= "@+id/video_view android:layout_width=" Match_pa Rent "android:layout_height=" wrap_content "android:layout_centerinparent=" true "/> <master.flame.danma Ku.ui.widget.DanmakuView android:id= "@+id/danmaku_view" android:layout_width= "Match_parent" Android:layout_ height= "Match_parent"/> <linearlayout android:id= "@+id/operation_layout" match 
    _parent "android:layout_height=" 50DP "android:layout_alignparentbottom=" true "android:background=" #fff " 
      Android:visibility= "Gone" > <edittext android:id= "@+id/edit_text" android:layout_width= "0DP" Android:layout_height= "Match_parent" android:layout_weight= "1"/> <button android:id= "@+id/send" Android:layo Ut_width= "Wrap_content" android:layout_height= "match_parent" android:text= "Send"/> </linearlayout& 
Gt 
 </RelativeLayout>

Package com.jackie.bombscreen; 
Import Android.graphics.Color; 
Import Android.os.Build; 
Import Android.os.Bundle; 
Import android.os.Environment; 
Import android.support.v7.app.AppCompatActivity; 
Import Android.text.TextUtils; 
Import Android.view.View; 
Import Android.widget.Button; 
Import Android.widget.EditText; 
Import Android.widget.LinearLayout; 
 
Import Android.widget.VideoView; 
 
Import Java.util.Random; 
Import Master.flame.danmaku.controller.DrawHandler; 
Import Master.flame.danmaku.danmaku.model.BaseDanmaku; 
Import Master.flame.danmaku.danmaku.model.DanmakuTimer; 
Import Master.flame.danmaku.danmaku.model.IDanmakus; 
Import Master.flame.danmaku.danmaku.model.android.DanmakuContext; 
Import Master.flame.danmaku.danmaku.model.android.Danmakus; 
Import Master.flame.danmaku.danmaku.parser.BaseDanmakuParser; 
 
Import Master.flame.danmaku.ui.widget.DanmakuView; 
  public class Mainactivity extends Appcompatactivity {private Boolean Misshowdanmaku; Private DanmakuviEW Mdanmakuview; 
 
  Private Danmakucontext Mdanmakucontext; Private Basedanmakuparser parser = new Basedanmakuparser () {@Override protected Idanmakus parse () {Retu 
    RN new Danmakus (); 
 
  } 
  }; 
    @Override protected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); 
    Setcontentview (R.layout.activity_main); 
    Videoview Videoview = (videoview) Findviewbyid (R.id.video_view); 
    Videoview.setvideopath (Environment.getexternalstoragedirectory () + "/xiaoxingyun.mp4"); 
 
    Videoview.start (); 
    Mdanmakuview = (Danmakuview) Findviewbyid (R.id.danmaku_view); 
    Mdanmakuview.enabledanmakudrawingcache (TRUE); Mdanmakuview.setcallback (New Drawhandler.callback () {@Override public void prepared () {Misshowdan 
        Maku = true; 
        Mdanmakuview.start (); 
      Generatesomedanmaku (); 
  @Override public void Updatetimer (Danmakutimer timer) {} @Override    public void Danmakushown (Basedanmaku danmaku) {} @Override public void drawingfinished () { 
 
    } 
    }); 
    Mdanmakucontext = Danmakucontext.create (); 
 
    Mdanmakuview.prepare (parser, Mdanmakucontext); 
    Final LinearLayout operationlayout = (linearlayout) Findviewbyid (r.id.operation_layout); 
    Final Button send = (Button) Findviewbyid (r.id.send); 
    Final EditText EditText = (edittext) Findviewbyid (R.id.edit_text); 
        Mdanmakuview.setonclicklistener (New View.onclicklistener () {@Override public void OnClick (view view) { 
        if (operationlayout.getvisibility () = = View.gone) {operationlayout.setvisibility (view.visible); 
        else {operationlayout.setvisibility (view.gone); 
     
    } 
      } 
    }); Send.setonclicklistener (New View.onclicklistener () {@Override public void OnClick (view view) {STR 
        ing content = edittext.gettext (). toString (); If(! 
          Textutils.isempty (content)) {Adddanmaku (content, true); 
        Edittext.settext (""); 
 
    } 
      } 
    }); 
      GetWindow (). Getdecorview (). Setonsystemuivisibilitychangelistener (New View.onsystemuivisibilitychangelistener () { @Override public void Onsystemuivisibilitychange (int visibility) {if visibility = = View.system_ui_flag_v 
        isible) {onwindowfocuschanged (true); 
  } 
      } 
    }); /** * Add a bullet screen to the view of the barrage * @param content of the contents of the barrage * @param withborder shells have a border * * private void AD Ddanmaku (String content, Boolean withborder) {Basedanmaku Danmaku = MDanmakuContext.mDanmakuFactory.createDanmaku (Ba 
    SEDANMAKU.TYPE_SCROLL_RL); 
    Danmaku.text = content; 
    danmaku.padding = 5; 
    Danmaku.textsize = sp2px (20); 
    Danmaku.textcolor = Color.White; 
    Danmaku.settime (Mdanmakuview.getcurrenttime ()); 
    if (withborder) {danmaku.bordercolor = Color.green; } MdanmakuView.adddanmaku (Danmaku); /** * Randomly generated some bullet screen content for testing/private void Generatesomedanmaku () {New Thread (new Runnable () {@Ov 
          Erride public void Run () {while (Misshowdanmaku) {int time = new Random (). Nextint (300); 
          String content = "" + Time + time; 
          Adddanmaku (content, false); 
          try {thread.sleep (time); 
          catch (Interruptedexception e) {e.printstacktrace (); 
  }}}). Start (); 
   }/** * SP to px method. 
    * * public int sp2px (float spvalue) {final float Fontscale = getresources (). Getdisplaymetrics (). scaleddensity; 
  return (int) (Spvalue * fontscale + 0.5f); 
    } @Override protected void OnPause () {super.onpause (); 
    if (Mdanmakuview!= null && mdanmakuview.isprepared ()) {mdanmakuview.pause (); 
    }} @Override protected void Onresume () {super.onresume (); if (MdanmaKuview!= null && mdanmakuview.isprepared () && mdanmakuview.ispaused ()) {mdanmakuview.resume (); 
    }} @Override protected void OnDestroy () {Super.ondestroy (); 
    Misshowdanmaku = false; 
      if (Mdanmakuview!= null) {mdanmakuview.release (); 
    Mdanmakuview = null;  
    @Override public void Onwindowfocuschanged (Boolean hasfocus) {super.onwindowfocuschanged (hasfocus); 
      if (Hasfocus && Build.VERSION.SDK_INT >=) {View Decorview = GetWindow (). Getdecorview (); Decorview.setsystemuivisibility (view.system_ui_flag_layout_stable | view.system_ui_flag_layout_hide_navigation | View.system_ui_flag_layout_fullscreen | view.system_ui_flag_hide_navigation | View.system_ui_flag_fullscreen | 
    View.system_ui_flag_immersive_sticky); 
 } 
  } 
}

The effect chart is as follows:

Their own shells have a green border, it is easy to distinguish.

Basically realized the function of the screen, of course, there are many knowledge points, this is just the most basic function. If you have the time, suggest to learn danmakuflamemaster, there are a lot of cool features.

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.