"Viewpager's Learning" ii. add picture description and indicator point dynamic change

The first section has been implemented Viewpager, but in practice it is often necessary to add some picture description information at the bottom of the picture resource, as well as some indication points.

The effect is as follows:

The indicator point can generate a simple origin with shape, with the following code:

<?xml version= "1.0" encoding= "Utf-8"? ><shape xmlns:android= "Http://schemas.android.com/apk/res/android"     android:shape= "Oval" >    <size android:width= "5DP" android:height= "5DP"/>    <solid android: Color= "#aaFFFFFF"/></shape>

This is the code of the white indicator point when selected, and the gray color is not selected.

Then create a point.xml file under Res/drawable to handle the indicator point styles displayed in different states:

<?xml version= "1.0" encoding= "Utf-8"? ><selector xmlns:android= "http://schemas.android.com/apk/res/ Android >    <!--android:state_enabled and imageview.setenabled    <item android:drawable= "@ Drawable/point_nomal "android:state_enabled=" false "/>    <item android:drawable=" @drawable/point_choose " Android:state_enabled= "true"/></selector>

Once you have established the indicator point resource file, you can create:

 @Override protected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate);        Setcontentview (R.layout.activity_main);        Viewpager = (Viewpager) Findviewbyid (R.id.viewpager);        Point_group = (linearlayout) Findviewbyid (R.id.point_group);        Image_desc = (TextView) Findviewbyid (R.ID.IMAGE_DESC);                ImageList = new arraylist<imageview> (); for (int i = 0; i < imageids.length; i++) {//Initialize picture resource ImageView im = new ImageView (this); Im.setbackground Resource (Imageids[i]); Imagelist.add (IM);//Add indicator points ImageView point = new ImageView (this);//configuration parameter information <span style= "COLOR: #ff6600; " >linearlayout.layoutparams params = new Linearlayout.layoutparams (layoutparams.wrap_content, LayoutParams.WRAP_ CONTENT);p Arams.rightmargin = 20;//indicator Point add parameter point.setlayoutparams (params) </span>;// Set the indicator point picture Point.setbackgroundresource (R.DRAWABLE.POINT_BG);//Set the first white, the other gray if (i = = 0) {point.setenabled (false);} Else{point.setenabled (TRUE);}Point_group.addview (point);} 

Be sure to remember that the parent of the current view (which is Pointgroup) is linearlayout, so call Lineaylayout.layoutparams when you set the parameter. Remember: associated with the parent viewgroup.

After setting the indicator point, how to control the dynamic update? is to switch to the second page, the second indicator point is white, the first one from white to gray?

Viewpager has a Setonpagechangelistener method, which is called when the Viewpager is switched, and we implement the dynamic change of the description information and indicator state in this method:

/**         * Viewpager when sliding *         *        /Viewpager.setonpagechangelistener (new Onpagechangelistener () {        /**         * Called when the page is sliding         */@Overridepublic void onpageselected (int position) {//position for redundancy, for loop sliding position = position% Imagelist.size ();//Set Text description content Image_desc.settext (descrip[position]);//change indicator State, let current is false, change previous to Truepoint_ Group.getchildat (position). setenabled (False);p Oint_group.getchildat (lastposition). SetEnabled (True); Lastposition = position;} /** * Callback When the page is sliding, less use */@Overridepublic void onpagescrolled (int position, float positionoffset,int positionoffsetpixels) {//Todo automatically generated method stub}/** * callback when page state changes, also less use */@Overridepublic void onpagescrollstatechanged (int state) {//TODO automatically generated method stub} });

this realizes the picture description of the Viewpager and indicates the dynamic change of the point state.

The effect is as follows:

Learning from Viewpager. Add a picture description and change the indicator point dynamically