Thumbnail image of Android Image browser

Source: Internet
Author: User

Recently in self-learning Android, try to implement the image browser that is present on the general phone, starting with the thumbnail image.

Direct, this is the Google phone comes with photos picture browser.


By looking at the data, we understand that the work that needs to be done before implementing the thumbnail image is:

1, find all the pictures on the phone, including, take pictures, through the USB from the computer to paste the way stored in a number of folders,

Store the full path of the picture in a string array;

2, for a certain picture, whether it is the thumbnail or full screen display, you need to display in a component (just the size of the picture is not the same);

3, looking for a component, can be used to store each thumbnail, complete grid-like effect;

For the 1th, White is the file search and selection function, both in the computer and mobile phones are applicable.

Because only the picture file is used here, it is necessary to filter out the regular several image formats (jpg,jpeg,tif,tiff,png,gif,bmp).

The key code is as follows:

1 New Arraylist<string> ();
1 String pathroot = Environment.getexternalstoragedirectory (). GetPath () + "/"; 2 New File (pathroot); 3 getallfiles (root);
1 Private voidgetallfiles (File root) {2File files[] =root.listfiles ();3         if(Files! =NULL){4              for(File f:files) {5                 if(F.isdirectory ()) {6 getallfiles (f);7}Else{8String strf =f.tostring ();9String str = strf.substring (Strf.length ()-4, Strf.length ());Ten                     if(Str.equals (". bmp") | | Str.equals (". jpg") | | Str.equals (". jpeg") | | Str.equals (". png") | | Str.equals (". gif") | | Str.equals (". tif") | | Str.equals (". Tiff")){ One                         BooleanBOOL =Fullpathimg.add (STRF); A                     } -                 } -             } the         } -}

The above three sections of code are: Define a String type of ArrayList variable fullpathimg, used to store the image path; get the phone SD card path; Search image file Implementation function, is a recursive process.

For the 2nd, there are too many components in Android that can display pictures, such as ImageView, ImageButton, even button, toast and so on sometimes can come together lively.

There are many ways to use ImageView to assign images to them:

1,Setimagebitmap (Bitmapfactory.decodefile (ImagePath)); ImagePath is a string type, which refers to the full name of the picture;

2,Setimageresource (R.mipmap.ic_launcher); to assign values through resources, you need to import the project in advance, or call Android to bring resources;

3,setimagedrawable (Getresources () getdrawable (R.mipmap.ic_launcher)) , and the second is very similar, through the drawable to assign value, just a few more steps;

Since this application is to read the image resources through the file name, the first is used.

To complete the 3rd, because it is a beginner, the use of a better implementation of the GridView component. However, you need to implement a class imageadapter that inherits from Baseadapter, with the following code:

1  Public classImageadapterextendsBaseadapter {2 3         Privatecontext context;4 5         intcountimg;6 7          PublicImageadapter (Context context) {8              This. Context =context;9              This. countimg =fullpathimg.size ();Ten         } One  A @Override -          Public intGetCount () { -             returncountimg; the         } -  -          PublicObject GetItem (intposition) { -             returnposition; +         } -  +          Public LongGetitemid (intposition) A         { at             returnposition; -         } -  - @Override -          PublicView GetView (intposition, View Convertview, viewgroup parent) -         { inWindowWidth =Getwindowmanager (). Getdefaultdisplay (). getwidth (); -             intPad = 4; to             if(Convertview = =NULL){ +ImageView =NewImageView (context); -             } the             Else{ *ImageView =(ImageView) Convertview; $             }Panax NotoginsengImageview.setlayoutparams (NewGridview.layoutparams ((Windowwidth-pad *)/4, (Windowwidth-pad * 12)/4)); - Imageview.setscaletype (ImageView.ScaleType.CENTER_CROP); the Imageview.setimagebitmap (Bitmapfactory.decodefile (fullpathimg.get (position))); +             returnImageView; A         } the}

  The Imageadapter class mainly implements five methods, namely, construct, get the total number, get the element position, get the element ID, get the view, the most critical is the last GetView ().

There are two points to note:

   1, do not manually go to all the picture resources and components of the GridView Association, through the following statement to develop path variables and location information can be,

Imageview.setimagebitmap (Bitmapfactory.decodefile (fullpathimg.get (position))); ImageView is a variable of ImageView class;

2, the size of the ImageView is set, the resolution of the mobile phone screen as a reference, get the following way,

int windowwidth = Getwindowmanager (). Getdefaultdisplay (). GetWidth (); Get width, height similar;

Imageadapter implementation, the following gives the GridView definition of the Activity_main.xml file content:

1 <LinearLayoutxmlns:android= "Http://schemas.android.com/apk/res/android"2 Xmlns:tools= "Http://schemas.android.com/tools"3 Android:layout_width= "Match_parent"4 Android:layout_height= "Match_parent" >5 6     <GridView7         Android:id= "@+id/gridview"8 Android:layout_width= "Match_parent"9 Android:layout_height= "Match_parent"Ten Android:listselector= "@android: Color/transparent" One Android:cachecolorhint= "@android: Color/transparent" A android:horizontalspacing= "4DP" - android:verticalspacing= "4DP" - Android:layout_marginleft= "8DP" the Android:layout_marginright= "8DP" - Android:layout_margintop= "8DP" - Android:layout_marginbottom= "8DP" - Android:stretchmode= "ColumnWidth" + android:gravity= "Center" - Android:fadescrollbars= "true" + android:fastscrollenabled= "true" A Android:numcolumns= "4" > at     </GridView> -  - </LinearLayout>

The properties that are set include size, transparency, the space between itself and the parent and the content, the number of thumbnail columns, the center, and the sliders, which are simply not explained.

  

When everything is ready, load it in the main program file mainactivity, here is the key code:

1 Setcontentview (r.layout.activity_main); 2 GridView = (GridView) Findviewbyid (R.id.gridview); 3 New Imageadapter (this); 4 Gridview.setadapter (adapter);

  

After the operation of the effect is good, the project is named Imagescan.

Of course, for a real picture browser, this is just one of the most basic features, that is, the first step, there is much to achieve,

If you click on an image to enlarge the display immediately, then you can swipe left or right, you can zoom, edit, and so on.

Interested friends can learn to communicate together, there are errors or deficiencies also hope that the great God guidance twos.

Thumbnail image of Android Image browser

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.