Android Press Surface analog ListView and Viewpager applications _android

Simulation of the News APP interface

1 write the layout before writing ListView:

Here are two kinds of Item layouts:

<?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=" 100DP "android:padding=" 10DP "> <imagev Iew android:layout_width= "100DP" android:layout_height= "60DP" android:id= "@+id/imageview" Android:backgrou nd= "@mipmap/ic_launcher" android:layout_centervertical= "true" android:layout_alignparentright= "true"/> <
    TextView android:layout_width= "wrap_content" android:layout_height= "wrap_content" android:text= "New text" Android:id= "@+id/tv_title" android:maxlines= "3" android:layout_marginright= "10DP" Android:layout_alignparentto
    P= "true" android:layout_alignparentleft= "true" android:layout_toleftof= "@+id/imageview"/> <TextView Android:layout_width= "Wrap_content" android:layout_height= "wrap_content" android:textappearance= "? android:attr/ Textappearancesmall "Android:text= "Small Text" android:id= "@+id/tv_time" android:layout_alignparentbottom= "true" android:layout_alignparentl Eft= "true"/> </RelativeLayout> activity_item

<?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=" wrap_content "android:padding=" 10DP "> <
    TextView android:id= "@+id/tv_title" android:layout_width= "match_parent" android:layout_height= "Wrap_content"
    android:text= "@string/app_name" android:singleline= "true"/> <linearlayout android:id= "@+id/line1" Android:layout_width= "Match_parent" android:layout_height= "60DP" android:layout_below= "@id/tv_title" android:l
      ayout_margintop= "10DP" > <imageview android:id= "@+id/imageview1" android:layout_width= "100DP" android:layout_height= "60DP" android:layout_weight= "1" android:layout_marginright= "10DP" Android:backgro
      und= "@mipmap/ic_launcher"/> <imageview android:id= "@+id/imageview2" android:layout_width= "100DP" Android:layout_height= "60dP "android:layout_weight=" 1 "android:layout_marginright=" 10DP "android:background=" @mipmap/ic_launcher " /> <imageview android:id= "@+id/imageview3" android:layout_width= "100DP" android:layout_height = "60DP" android:layout_weight= "1" android:background= "@mipmap/ic_launcher"/> </LinearLayout> &l T TextView android:layout_width= "wrap_content" android:layout_height= "wrap_content" "android:textappearance="? Roid:attr/textappearancesmall "android:text=" Small text "android:id=" @+id/tv_time "android:layout_below=" @id/L Ine1 "android:layout_alignparentleft=" true "/> </RelativeLayout> activity_item2

The first one is a single picture, the second one is three pictures.

In the ListView add the head layout, using Viewpager to achieve the effect of sliding:

<?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.support.v4.view.ViewPager
    android:id= "@+id/vp"
    android:layout_width= "Match_parent"
    Android : layout_height= "200DP"/>

  <textview
    android:id= "@+id/tv_msg" android:layout_width= "WRAP_"
    Content "
    android:layout_height=" wrap_content "
    android:layout_centerhorizontal=" true "
    Android: Layout_marginbottom= "5DP"
    android:layout_alignbottom= "@+id/vp"
    android:textcolor= "#ddd"
    Android : text= "Wu Jianming and China Diplomacy"
    android:singleline= "true"/>

</RelativeLayout>

activity_item_header

Finally, the layout of the ListView;

<?xml version= "1.0" encoding= "Utf-8"?> <relativelayout xmlns:android=
"http://schemas.android.com/apk" /res/android "
  xmlns:tools=" Http://schemas.android.com/tools "
  android:layout_width=" Match_parent
  " android:layout_height= "Match_parent"
  android:padding= "10DP"
  tools:context= " Com.dragon.android.baseadapter.MainActivity ">

  <listview
    android:layout_width=" Wrap_content "
    android:layout_height= "Wrap_content"
    android:scrollbars= "None"
    android:dividerheight= "1DP"
    Android:divider= "#ccc"
    android:id= "@+id/listview"/>
</RelativeLayout>

activity_main

2 The data to be displayed in the ListView first set themselves, do not make network requests.

<?xml version= "1.0" encoding= "Utf-8"?>
<resources>

  <string-array name= "titles" >
    <item> The unusual big fish that are caught ashore are often the focus of attention. A spectacle and a legendary experience enough to relish. </item>
    <item> Since 2008 officially launched, Hangzhou public bicycles at home and abroad ring powder countless, it beyond a landscape, a business card definition, become a lifestyle in Hangzhou. </item> <item> in the history of the
    Olympic Games, such absurd scenes as the American team's solo replay appeared. </item>
    <item> in the Brazilian Rio Olympic Games, Phelps body "Mysterious red circle" popular. </item>
    <item> Rio Olympic Games officially opened the curtain, for the country to fight for the athletes of the battle is raging. And in the Olympic arena, a large wave of hidden folk sports experts are also ready to stir. </item>
    <item>6 months since 30th, the fourth round of heavy rainfall to Hubei caused serious losses. </item>
    <item> Looking at the world's leading urban underground drainage system, it can be found that the true conscience of the sewer, even years past, still play a role. </item>
  </string-array>

  <string-array name= "msgs" >
    <item> Wu Jianming and China diplomatic </ item>
    <item> Gay bar: It's heaven and Hell </item>
    <item> Those years, we have this Dragon Boat festival </item>
    <item > MA 98: From the heartthrob to the doormat </item>
    <item> North Korea's happiness Pyongyang </item>
  </string-array>

</ resources>

Arrays

Picture resources can be added freely

3) Custom Adapter inheritance Baseadapter:

Package com.dragon.android.baseadapter;
Import Android.content.Context;
Import Android.view.LayoutInflater;
Import Android.view.View;
Import Android.view.ViewGroup;
Import Android.widget.BaseAdapter;
Import Android.widget.ImageView;

Import Android.widget.TextView;
Import Java.text.SimpleDateFormat;
Import Java.util.Date;
Import java.util.List;

Import Java.util.Locale;
 /** * Created by Auser on 2016/9/8.
  * * public class Myadapter extends Baseadapter {private final context;

  Private list<data> Mdata;
    Public Myadapter (context context, list<data> data) {this.mdata = data;
  This.context = context;
  The number of/** * @return Item * * @Override public int GetCount () {return mdata = = null? 0:mdata.size (); /** * @param position * @param Convertview < focus: Get the view that each Item will be displayed * @param parent * @return *
    Override public view GetView (int position, View Convertview, ViewGroup parent) {view view; Data data = GetItem (position);
      if (position% 3 = 0) {view = Layoutinflater.from (context). Inflate (r.layout.acyivity_item_2, parent, false);
      ImageView ImageView1 = (imageview) View.findviewbyid (R.ID.IMAGEVIEW1);
      ImageView imageView2 = (imageview) View.findviewbyid (R.ID.IMAGEVIEW2);
      ImageView imageView3 = (imageview) View.findviewbyid (R.ID.IMAGEVIEW3);
      Imageview1.setimageresource (Data.getimgresid () [0]);
      Imageview2.setimageresource (Data.getimgresid () [1]);

    Imageview3.setimageresource (Data.getimgresid () [2]);
      else {view = Layoutinflater.from (context). Inflate (R.layout.activity_item, parent, false);
      ImageView ImageView = (imageview) View.findviewbyid (R.id.imageview);
    Imageview.setimageresource (Data.getimgresid () [0]);
    } TextView Tv_title = (TextView) View.findviewbyid (r.id.tv_title);

    Tv_title.settext (Data.gettitle ());
    TextView tv_time = (TextView) View.findviewbyid (r.id.tv_time); String time = new Simpledateformat ("hh:mm", Locale.china). Format (New Date (Data.gettime ());
    Tv_time.settext (time);
  return view; /** * For developers to achieve their own, commonly used in the current position position of the data * when the item can be displayed on the screen, will call the GetView and pass the display of the item location * * @param posit 
    Ion the location of the newly displayed Item * @return * * * @Override public Data getitem (int position) {//LOG.D ("TAG", Position + "");
  return Mdata.get (position); /** * @param position when the user sets the ListView item's click Time, this value is passed as the fourth parameter * @return/@Override public long g
  Etitemid (int position) {return 10086; }} Myadapter

4) Because the header layout uses Viewpager implementation, the adapter to add a custom inherits Pageradapter:

Package com.dragon.android.baseadapter;
Import Android.support.v4.view.PagerAdapter;
Import Android.view.View;
Import Android.view.ViewGroup;

Import Android.widget.ImageView;

Import java.util.List;
 /** * Created by Auser on 2016/9/8.

  * * Class Mypageradapter extends Pageradapter {private list<imageview> mlist;
  Public Mypageradapter (list<imageview> mlist) {this.mlist = mlist; /** * Determines how several child views can be displayed in Viewpager * @return sliding boundaries * * * @Override public int GetCount () {//2 of 31-1/
  /mlist.size=5:0--4//position:0---9//0%5=0,4%5=4,//5%5=0,6%5=1....9%5=4 return integer.max_value; /** * produces Item.container: container.--->viewpager * @param container * @param position * @return * * @Overr
    IDE public Object Instantiateitem (viewgroup container, int position) {//Add ImageView to the Viewpager container.

    Container.addview (mlist.get (position% mlist.size ()));
  Return Mlist.get (position% mlist.size ());
 }

  /**  * Determine whether the current view is the first time it is produced.

    * @param view * @param obj * @return * * @Override public boolean isviewfromobject (view view, Object obj) {
  return view = = obj; /** * Removes an item * @param container * @param position * @param object/@Override public void Destr Oyitem (ViewGroup container, int position, object object) {//Remove view from Container Container.removeview (mlist.get (position% m
  List.size ())); }} Mypageradapter

Here to pay attention to how to achieve the Viewpager sliding cycle effect---that is to set a very large boundary, loop display.

5 requires a container to store the data to be displayed, which encapsulates a class

 package com.dragon.android.baseadapter;

Import Java.util.Arrays;
 /** * Created by Auser on 2016/9/8.
  * * Public class Data {private int[] imgresid;
  Private String title;

  Private long time; @Override public String toString () {return "data{" + "imgresid=" + arrays.tostring (IMGRESID) + ", t
  Itle= ' + title + ' \ ' + ', time= ' + Time + '} ';
    The public data () {} is public data (String title, int[] Imgresid, long time) {this.imgresid = Imgresid;
    This.title = title;
  This.time = time;
  Int[] Getimgresid () {return imgresid;
  } public void Setimgresid (int[] imgresid) {this.imgresid = Imgresid;
  Public String GetTitle () {return title;
  public void Settitle (String title) {this.title = title;
  Public long GetTime () {return time;
  public void SetTime (long time) {this.time = time; }} Data 

6) Finally configure the adapter in mainactivity for ListView and Viewpager (while the text changes with the sliding synchronization of the Viewpager)

Package com.dragon.android.baseadapter;
Import Android.os.Bundle;
Import Android.support.v4.view.ViewPager;
Import android.support.v7.app.AppCompatActivity;
Import Android.view.View;
Import Android.widget.ImageView;
Import Android.widget.ListView;

Import Android.widget.TextView;
Import java.util.ArrayList;

Import java.util.List;
  public class Mainactivity extends Appcompatactivity {private ListView ListView;
  Private list<data> Mdata;
  Private list<imageview> mlist;
  Private Viewpager mVp;

  Private TextView mTv; Private int[] Imgresids = {r.mipmap.c1, r.mipmap.c2, r.mipmap.c3, r.mipmap.c4, R.mipmap.c5, R.mipmap.c6, R.mipmap.c7

  , R.mipmap.c8, R.mipmap.c9, R.MIPMAP.C10, R.mipmap.c11, R.MIPMAP.C12, r.mipmap.c13};

  Private int[] Imageheaderids = {R.MIPMAP.A1,R.MIPMAP.A2,R.MIPMAP.A3,R.MIPMAP.A4,R.MIPMAP.A5};
    @Override protected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Setcontentview (r.layout.activity_mAin);
    ListView = (ListView) Findviewbyid (R.id.listview);

    string[] Stringarray = Getresources (). Getstringarray (R.array.titles);
    Mdata = new arraylist<> ();

    InitData (Stringarray);

    AddHeader ();
    Myadapter myadapter = new Myadapter (this, mdata);
  Listview.setadapter (Myadapter); /** * Add head layout Viewpager/private void AddHeader () {View view = Getlayoutinflater (). from (this). Inflate (R
    . Layout.activity_item_header, ListView, false);

    Listview.addheaderview (view);
    MVp = (Viewpager) View.findviewbyid (R.ID.VP);
    MTv = (TextView) View.findviewbyid (r.id.tv_msg);

    string[] msgs = Getresources (). Getstringarray (R.ARRAY.MSGS);
    Create a data source. Store head layout to show view mlist = new arraylist<imageview> ();
      for (int i = 0; i < imageheaderids.length. i++) {ImageView IV = new ImageView (this);
      Iv.setbackgroundresource (Imageheaderids[i]);
    Mlist.add (iv);
    } mypageradapter adapter = new Mypageradapter (mlist); Mvp.sEtadapter (adapter);

    Set Viewpager is currently the first few views Mvp.setcurrentitem (1000 * mlist.size ());
    Mvp.setonpagechangelistener (listener); Mvp.addonpagechangelistener (New Viewpager.simpleonpagechangelistener () {@Override public void onpageselected (int position)

        {string[] msgs = Getresources (). Getstringarray (R.ARRAY.MSGS);
      Let the title switch with the Viewpager switch mtv.settext (msgs[position% mlist.size ()));
  }
    });
    /** * Create Data source * @param stringarray */private void InitData (string[] stringarray) {int j = 0;
      for (int i = 0; i < stringarray.length i++) {Long L = system.currenttimemillis (); if (i% 3 = 0) {mdata.add (new Data (Stringarray[i], new int[]{imgresids[j++], imgresids[j++], imgresids[j++]}, L
      + 1000000 * i));
      else {mdata.add (new Data (Stringarray[i], new int[]{imgresids[j++]}, L + 1000000 * i)); }
    }
  }
}

Above is the press side of the simulation example, the need for friends can look, thank you all for the support of this site!