Android Imitation micro-letter hair friend Circle Browse Picture effect _android

Let's look at the effect first:

Here is how to achieve the specific:

Realize the idea

• 1. First we want to obtain the data source, the data source is our each article say (including name, title, picture array)
• 2. Custom Adapter (ListView nested GridView)
• 3. Picture Click Browse Picture (Fragment+viewpager)

Concrete implementation

1. Initialize the data source, set the adapter, and look at the code:

public class MyActivity extends activity {/* Picture Display list * * Private ListView ListView;
  /* Picture URL array * * private list<contentbean> Contentbeans;

  * Say adapter * * Private Myadapter adapter;
   /** * Called when the "activity is" is a-created.
    * * @Override public void onCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate);
    Setcontentview (R.layout.main);
    InitData ();
  Initviews ();
    }/** * Initialization data/private void InitData () {Contentbeans = new arraylist<contentbean> ();
    arraylist<string> imgUrls1 = new arraylist<string> (); Imgurls1.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 ");
    Contentbean CB1 = new Contentbean (1, "Java", "Sun Microsystems", IMGURLS1);

    Contentbeans.add (CB1);
    arraylist<string> imgUrls2 = new arraylist<string> (); Imgurls2.add ("Http://7xojuc.com1.z0.glb.")Clouddn.com/110h2e40-6.jpg?attname=&e=1448288962&token=kdscquawz3p-yt6in6opnt56eh2cig4zgqd12sj_:
    ALTJFYD9SBFODB4JMMZUKXAMOP8 "); Imgurls2.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 "); Imgurls2.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 ");
    Contentbean CB2 = new Contentbean (2, "OC", "StepStone", IMGURLS2);

    Contentbeans.add (CB2);
    arraylist<string> IMGURLS3 = new arraylist<string> (); Imgurls3.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 "); Imgurls3.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token= Kdscquawz3p-yt6in6opnt56eh2cig4zgqd12sj_:altjfyd9sbfodb4JMMZUKXAMOP8 "); Imgurls3.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 "); Imgurls3.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 "); Imgurls3.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 "); Imgurls3.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 "); Imgurls3.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 "); Imgurls3.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&AMP;TOKEN=KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 "); Imgurls3.add ("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=
    KDSCQUAWZ3P-YT6IN6OPNT56EH2CIG4ZGQD12SJ_:ALTJFYD9SBFODB4JMMZUKXAMOP8 ");
    Contentbean cb3 = new Contentbean (3, "Python", "Guido van Rossum", IMGURLS3);
  Contentbeans.add (CB3);
    private void Initviews () {ListView = (ListView) Findviewbyid (r.id.lv_my);
    adapter = new Myadapter (Myactivity.this,contentbeans);
  Listview.setadapter (adapter);

 }
}

The picture inside this is I uploaded to seven cattle network picture, load picture is with Imageloader, below also have specific imageloader configuration.
2. Look at the adapter contents
in the talk list adapter to set the image adapter, the image of the GridView is rewritten a can not slide the GridView, rewrite the onmeasure ();

public class Myadapter extends Baseadapter {private context context;

  Private list<contentbean> data;
    Public Myadapter (context context, list<contentbean> data) {This.context = context;
  This.data = data;
  @Override public int GetCount () {return data.size ();
  @Override public Object getitem (int i) {return data.get (i);
  @Override public long Getitemid (int i) {return i;
    @Override public View GetView (int i, view view, ViewGroup viewgroup) {Viewholder holder;
      if (view = = null) {holder = new Viewholder ();
      View = view.inflate (context, r.layout.item, null);
      Holder.gridview = (Noscrollgridview) View.findviewbyid (R.id.gridview);
      Holder.tvname = (TextView) View.findviewbyid (r.id.tv_name);
      Holder.tvtitle = (TextView) View.findviewbyid (r.id.tv_title);
    View.settag (holder);
    else {holder = (Viewholder) view.gettag ();

 Final Contentbean bean = Data.get (i);   Holder.tvName.setText (Bean.getname ());

    Holder.tvTitle.setText (Bean.gettitle ()); if (data!= null && data.size () > 0) {holder.gridView.setAdapter (new Imagegridadapter context, Bean.geti
    Mgurls ()));
      /** * Picture List click event/Holder.gridView.setOnItemClickListener (new Adapterview.onitemclicklistener () { @Override public void Onitemclick (adapterview<?> adapterview, view view, int I, long l) {Intent inte
        NT = new Intent (context, imagepageractivity.class);
        Intent.putextra (Imagepageractivity.extra_image_urls, (Serializable) bean.getimgurls ());
        Intent.putextra (Imagepageractivity.extra_image_index, i);
      Context.startactivity (Intent);

    }
    });
  return view;
    Class Viewholder {TextView tvname, tvtitle;
  Noscrollgridview GridView;

 }
}

3. Then is the picture browsing, this online also has many demo, also has the detailed explanation, directly pulls over uses on can, the following picture quantity is listens for the Setonpagechangelistener () to change the following picture index value

/** * Picture Viewer */public class Imagepageractivity extends Fragmentactivity {private static final String state_position
  = "State_position"; 
  public static final String Extra_image_index = "Image_index";

  public static final String extra_image_urls = "Image_urls";
  Private Hackyviewpager Mpager;
  private int pagerposition;

  Private TextView indicator;
    @Override public void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate);

    Setcontentview (R.layout.image_detail_pager);
    Pagerposition = Getintent (). Getintextra (Extra_image_index, 0);

    arraylist<string> urls = getintent (). Getstringarraylistextra (Extra_image_urls);
    Mpager = (Hackyviewpager) Findviewbyid (R.id.pager);
    Imagepageradapter madapter = new Imagepageradapter (Getsupportfragmentmanager (), URLs);
    Mpager.setadapter (Madapter);

    Indicator = (TextView) Findviewbyid (r.id.indicator); Charsequence Text = getString (r.string.viewpager_indicator, 1, Mpager.getadapter (). GetCount ());
    Indicator.settext (text); Update subscript Mpager.setonpagechangelistener (new Onpagechangelistener () {@Override public void Onpagescrollsta

      techanged (int arg0) {} @Override public void onpagescrolled (int arg0, float arg1, int arg2) {} @Override public void onpageselected (int arg0) {charsequence text = getString (r.string.viewpager_ind
        Icator, arg0 + 1, mpager.getadapter (). GetCount ());
      Indicator.settext (text);
    }

    });
    if (savedinstancestate!= null) {pagerposition = Savedinstancestate.getint (state_position);
  } mpager.setcurrentitem (Pagerposition); @Override public void Onsaveinstancestate (Bundle outstate) {outstate.putint (state_position, Mpager.getcurrenti
  TEM ());

    Private class Imagepageradapter extends Fragmentstatepageradapter {public arraylist<string> filelist; Public Imagepageradapter (Fragmentmanager FM, arraylist<string> FilelisT) {super (FM);
    This.filelist = filelist;
    @Override public int GetCount () {return filelist = = null 0:filelist.size ();
      @Override public Fragment getitem (int position) {String URL = filelist.get (position);
    return imagedetailfragment.newinstance (URL);

 }

  }
}

Picture fragment the detailed interface, which has a long click event, and picture loading status

Package com.hankkin.WeiXinLookImgsDemo.activty;
Import Android.graphics.Bitmap;
Import Android.os.Bundle;
Import android.support.v4.app.Fragment;
Import Android.view.LayoutInflater;
Import Android.view.View;
Import Android.view.ViewGroup;
Import Android.widget.ImageView;
Import Android.widget.ProgressBar;

Import Android.widget.Toast;
Import COM.HANKKIN.WEIXINLOOKIMGSDEMO.R;
Import Com.nostra13.universalimageloader.core.ImageLoader;
Import Com.nostra13.universalimageloader.core.assist.FailReason;
Import Com.nostra13.universalimageloader.core.listener.SimpleImageLoadingListener;

Import Com.others.PhotoViewAttacher;
  /** * Single picture shows Fragment/public class Imagedetailfragment extends Fragment {private String mimageurl;
  Private ImageView Mimageview;
  Private ProgressBar ProgressBar;

  Private Photoviewattacher Mattacher; public static imagedetailfragment newinstance (String imageUrl) {final imagedetailfragment f = new imagedetailfragment

    (); Final Bundle args = new BundlE ();
    args.putstring ("url", IMAGEURL);

    F.setarguments (args);
  return F;
    @Override public void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Mimageurl = getarguments ()!= null?
  Getarguments (). getString ("url"): null; @Override public View Oncreateview (layoutinflater inflater, ViewGroup container, Bundle savedinstancestate) {f
    Inal View v = inflater.inflate (R.layout.image_detail_fragment, container, false);
    Mimageview = (ImageView) V.findviewbyid (r.id.image);

    Mattacher = new Photoviewattacher (Mimageview); Mattacher.setonphototaplistener (New Photoviewattacher.onphototaplistener () {@Override public void Onphototap (View arg0, float arg1, float arg2)
      {getactivity (). Finish ();
    }
    }); Mattacher.setonlongclicklistener (New View.onlongclicklistener () {@Override public boolean onlongclick (View VI EW) {Toast.maketext (Getactivity (). Getapplicationcontext (), "Save", toAst.
        Length_short). Show ();
      return false;
    }
    });
    ProgressBar = (ProgressBar) V.findviewbyid (r.id.loading);
  return v; @Override public void onactivitycreated (Bundle savedinstancestate) {super.onactivitycreated (savedinstancestate

    ); Imageloader.getinstance (). DisplayImage (Mimageurl, Mimageview, New Simpleimageloadinglistener () {@Override Pub
      LIC void onloadingstarted (String imageuri, view view) {progressbar.setvisibility (view.visible); @Override public void onloadingfailed (string imageuri, view view, Failreason Failreason) {string m
        Essage = null;
          Switch (Failreason.gettype ()) {Case io_error:message = "Download Error";
        Break
          Case decoding_error:message = "picture cannot show";
        Break
          Case network_denied:message = "Network has problems, can not download";
        Break
          Case out_of_memory:message = "picture too big to show";
        Break Case UNKNOwn:message = "Unknown error";
        Break
        } toast.maketext (Getactivity (), message, Toast.length_short). Show ();
      Progressbar.setvisibility (View.gone); @Override public void Onloadingcomplete (String imageuri, view view, Bitmap loadedimage) {PROGRESSB
        Ar.setvisibility (View.gone);
      Mattacher.update ();
  }
    });

 }
}

Forget the imageloader of the original chemical, to everyone add it, I wrote to the application.

Private MyApplication context;
    @Override public void OnCreate () {super.oncreate ();
    context = this;
  Initimageloader (context); /** * Initialize Imageloader * by Hankkin at:2015-11-22 23:20:29 * @param context */public static void Initima Geloader (Context context) {displayimageoptions options = new Displayimageoptions.builder (). showimageonloading (R.drawable.ic_launcher). Showimageonfail (R.drawable.ic_launcher). Resetviewbeforeloading (False)//Defaul T. delaybeforeloading (0). Cacheinmemory (TRUE)//default. Cacheondisk (TRUE)//default. CO Nsiderexifparams (TRUE)//default. Imagescaletype (imagescaletype.in_sample_power_of_2)//default. BITMAPC Onfig (Bitmap.Config.ARGB_8888)//default. Displayer (New Simplebitmapdisplayer ())//default. Handler (new
    Handler ())//default. Build (); File Picpath = new file (Environment.getexternalstoragedirectory (). GetPath () +File.separator + "Weixinlookimgdemo" + File.separator + "files");  imageloaderconfiguration config = new Imageloaderconfiguration.builder (context). memorycacheextraoptions (480, 800) Default = Device screen dimensions. Diskcacheextraoptions (+, NULL). ThreadPoolSize (3)//Defaul T. ThreadPriority (THREAD.NORM_PRIORITY-1)//default. Tasksprocessingorder (QUEUEPROCESSINGTYPE.FIFO)// Default. Denycacheimagemultiplesizesinmemory (). MemoryCache (New Lrumemorycache (2 * 1024 * 1024)). Memorycachesize (2 * 1024 * 1024). Memorycachesizepercentage//default. DiskCache (New UNLIMITEDDISCCAC He (Picpath))//default. diskcachesize (1024 * 1024). Diskcachefilecount (1000). Diskcachefilen Amegenerator (New Hashcodefilenamegenerator ())//default. Imagedownloader (new Baseimagedownloader (context))/Def Ault. Imagedecoder (New Baseimagedecoder (TRUE))//default.Defaultdisplayimageoptions (options)//default. Writedebuglogs (). build ();
    Initialize imageloader with configuration.
  Imageloader.getinstance (). init (config);
 }

The above is about the Android micro-credit Circle to browse the image of the entire content of the picture, I hope to learn more about Android software programming help.