Android learning-grid view, image switcher, and androidgridview

Source: Internet
Author: User
Tags xml attribute

Android learning-grid view, image switcher, and androidgridview


The GridView is used to display multiple components by row and column distribution on the interface. The GridView and ListView have the same parent class: AbsListView. The difference between the GridView and ListView is that the ListView is distributed only in one direction, and the GridView is distributed in two directions. Therefore, when using the GridView, numColumns is generally specified to be greater than 1. Otherwise, the default value of this attribute is 1, which means that only one column in The GridView is changed to ListView.


Xml Attribute of GridView


Android: strtchMode value:



ImageSwitcher is derived from FrameLayout. The ImageSwitcher component is similar to ImageView, but ImageSwitcher has one more function: You can set the animation effect when switching the displayed image.

When using ImageSwitcher, you often need to set a makeView () method for ImageSwitcher. ViewFactory to display the ImageView.


The following is an example using GridView and ImageSwitcher.


(1) activity_main.xml layout: GridView and ImageSwitcher

<LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:gravity="center_horizontal">    <GridView         android:id="@+id/grid"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:horizontalSpacing="1dp"        android:verticalSpacing="2dp"        android:numColumns="4"/>    <ImageSwitcher         android:id="@+id/imageSwitch"        android:layout_gravity="center_vertical|center_horizontal"        android:layout_width="wrap_content"        android:layout_height="wrap_content"/>    </LinearLayout>

(2) img. xml layout imageView is used to display the picture of the GridView

<?xml version="1.0" encoding="UTF-8"?><LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="horizontal"    android:layout_width="fill_parent"    android:layout_height="fill_parent">        <ImageView         android:id="@+id/img"        android:layout_width="wrap_content"        android:layout_height="wrap_content"/></LinearLayout>

(3) MainActivity. java

Package com. example. viewimage; import java. util. arrayList; import java. util. hashMap; import java. util. list; import java. util. map; import android. app. activity; import android. OS. bundle; import android. util. log; import android. view. view; import android. view. animation. animationUtils; import android. widget. adapterView; import android. widget. adapterView. onItemClickListener; import android. widget. adapterView. onItemS ElectedListener; import android. widget. gridView; import android. widget. imageSwitcher; import android. widget. imageView; import android. widget. imageView. scaleType; import android. widget. simpleAdapter; import android. widget. viewSwitcher. viewFactory; public class MainActivity extends Activity {// define the private GridView gredView = null; private ImageSwitcher imageSwt = null; @ Overrideprotected void onCreate (Bundle SavedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. activity_main); // obtain the layout component gredView = (GridView) findViewById (R. id. grid); imageSwt = (ImageSwitcher) findViewById (R. id. imageSwitch); // image final int images [] = new int [] {R. drawable. name01, R. drawable. name02, R. drawable. name03, R. drawable. name04, R. drawable. name05, R. drawable. name06, R. drawable. name07, R. drawable. name08, R. drawable. nam E09, R. drawable. name10, R. drawable. name11, R. drawable. name12, R. drawable. name13, R. drawable. name14, R. drawable. name15, R. drawable. name16}; // create a list set to store the image List <Map <String, Object> list = new ArrayList <Map <String, Object> (); for (int I = 0; I <images. length; I ++) {Map <String, Object> map = new HashMap <String, Object> (); map. put ("img", images [I]); list. add (map) ;}// set the image replacement effect // fade-in effect imageSwt. setInAnimation (AnimationUtils. loa DAnimation (this, android. r. anim. fade_in); // fade out effect imageSwt. setOutAnimation (AnimationUtils. loadAnimation (this, android. r. anim. fade_out); // sets the image conversion effect imageSwt. setFactory (new ViewFactory () {@ Overridepublic View makeView () {ImageView imageView = new ImageView (MainActivity. this); imageView. setLayoutParams (new ImageSwitcher. layoutParams (300,300); imageView. setScaleType (ScaleType. FIT_CENTER); return imageView; }); // Set the adapter SimpleAdapter simpleAdapter = new SimpleAdapter (this, list, R. layout. img, new String [] {"img"}, new int [] {R. id. img}); // adapter gredView. setAdapter (simpleAdapter); // The selected event listens to gredView. setOnItemSelectedListener (new OnItemSelectedListener () {@ Overridepublic void onItemSelected (AdapterView <?> Parent, View view, int position, long id) {Log. I ("onItemSelected", "onItemSelected"); imageSwt. setImageResource (images [position]) ;}@ Overridepublic void onNothingSelected (AdapterView <?> Parent) {// TODO Auto-generated method stub}); // click the event to listen to gredView. setOnItemClickListener (new OnItemClickListener () {@ Overridepublic void onItemClick (AdapterView <?> Parent, View view, int position, long id) {Log. I ("onItemClick", "onItemClick"); imageSwt. setImageResource (images [position]) ;}}) ;}}

The running effect is as follows:



Android development: Use GridView with ImageSwitcher

Another click function in the Gridview, which is the image that is quietly clicked. It is passed to imageswitcher according to the parameter and displayed at last.
 
Android uses the GridView mesh view (such as the nine cells). Can the custom view be used to fill the view?

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.