Android UI Learning-the use of the GridView and ImageView

<span id="Label3"></p><strong><strong>GridView</strong></strong>: A view that shows items in two-dimensional scrolling grid. The items in the grid come from the<span style="text-decoration: underline;"><span style="text-decoration: underline;">ListAdapter</span></span>Associated with this VIEW.    To put it simply, the GridView is the icon display of the files we see in our Explorer. As mentioned above, the GridView item is from listadapter, so the code of the GridView is generally used in the oncreate of the Activity: <ol class="dp-j"> <ol class="dp-j"> <li class="alt"><span class="annotation">@Override</span></li> <li><span class="keyword">Public <span class="keyword">void OnCreate (Bundle Savedinstancestate) {</span></span></li> <li class="alt"><span class="keyword">super.oncreate (savedinstancestate);</span></li> <li></li> <li class="alt">Setcontentview (r.layout.grid_2);</li> <li></li> <li class="alt">GridView G = (gridview) Findviewbyid (r.id.mygrid);</li> <li>G.setadapter (<span class="keyword">new imageadapter (this<span class="keyword">));</span> </span></li> <li class="alt">}</li> </ol> </ol><strong><strong>and Imageadapter is generally extends baseadapter. Baseadapter is implements ListAdapter spinneradapter, but many times the custom adapter is the method of the parent ListAdapter interface of the override Adapter:</strong></strong>int GetCount () Gets the items number of the current adapter Object GetItem (int Position) gets the corresponding position item long Getitemid (int Position) Gets the corresponding position item in the list in the row ID View getView (int position, view convertview, viewgroup pare Nt) gets the view of the data to be displayed in the specified position these method functions are almost the same as swing, based on Mvc. Presumably the principle of the process is this: the program needs to display the gridview, then to the data one by one to show through a for loop, first call Adapter.getcount () to get how many data, and then position++ getitem, GetView get the view that you want to show, this looks like a show! Here is an example of the photo grid in the official sample, I omitted some code: <ol class="dp-j"> <li class="alt"><li class="alt"><span class="keyword">Public <span class="keyword">class Imageadapter <span class="keyword">extends Baseadapter {</span> </span></span></li></li> <li><li>public <span class="keyword">imageadapter (Context C) {</span></li></li> <li class="alt"><li class="alt">Mcontext = c;</li></li> <li><li>}</li></li> <li class="alt"><li class="alt"></li></li> <li><li><span class="keyword">public <span class="keyword">int GetCount () {</span> </span></li></li> <li class="alt"><li class="alt"><span class="keyword">return mthumbids.length;</span></li></li> <li><li>}</li></li> <li class="alt"><li class="alt"></li></li> <li><li>public <span class="keyword">Object getItem (<span class="keyword">int Position) {</span> </span></li></li> <li class="alt"><li class="alt"><span class="keyword">return position;</span></li></li> <li><li>}</li></li> <li class="alt"><li class="alt"></li></li> <li><li><span class="keyword">public <span class="keyword">long getitemid (<span class="keyword">int Position) {</span> </span> </span></li></li> <li class="alt"><li class="alt"><span class="keyword">return position;</span></li></li> <li><li>}</li></li> <li class="alt"><li class="alt"></li></li> <li><li>public <span class="keyword">View getView (<span class="keyword">int position, View convertview, viewgroup parent) {</span> </span></li></li> <li class="alt"><li class="alt">ImageView ImageView;</li></li> <li><li><span class="keyword">if (convertview = = <span class="keyword">Null) {</span> </span></li></li> <li class="alt"><li class="alt">ImageView = <span class="keyword">new ImageView (mcontext);</span></li></li> <li><li>Imageview.setlayoutparams (<span class="keyword">new Gridview.layoutparams)<span class="number"> <span class="number">; <span class="comment"> Setting ImageView width and height</span> </span> </span> </span></li></li> <li class="alt"><li class="alt">Imageview.setadjustviewbounds (<span class="keyword">false);</span></li></li> <li><li>Imageview.setscaletype (ImageView.ScaleType.CENTER_CROP);</li></li> <li class="alt"><li class="alt">Imageview.setpadding (<span class="number">8, <span class="number">8, <span class="number">8, <span class="number">8);</span> </span> </span> </span></li></li> <li><li>} <span class="keyword">Else {</span></li></li> <li class="alt"><li class="alt">ImageView = (imageView) convertview;</li></li> <li><li>}</li></li> <li class="alt"><li class="alt"></li></li> <li><li>Imageview.setimageresource (mthumbids[position]);</li></li> <li class="alt"><li class="alt"></li></li> <li><li><span class="keyword">return imageView;</span></li></li> <li class="alt"><li class="alt">}</li></li> <li><li></li></li> <li class="alt"><li class="alt"><span class="keyword">Private Context mcontext;</span></li></li> <li><li></li></li> <li class="alt"><li class="alt"><span class="keyword">private integer[] mthumbids = {</span></li></li> <li><li>r.drawable.sample_thumb_0, r.drawable.sample_thumb_1,</li></li> <li class="alt"><li class="alt">r.drawable.sample_thumb_2, r.drawable.sample_thumb_3,</li></li> <li><li>r.drawable.sample_thumb_4, r.drawable.sample_thumb_5,</li></li> <li class="alt"><li class="alt">r.drawable.sample_thumb_6, r.drawable.sample_thumb_7</li></li> <li><li>};</li></li> <li class="alt"><li class="alt">}</li></li> </ol>Note The code inside the GetView to determine if the Convertview is null for reuse, to reduce the creation of objects, and to reduce memory Consumption. The XML layout file content, Originally just indicates the Gridview: <ol class="dp-xml"> <li class="alt"><li class="alt"><span class="tag"><? <span class="tag-name">XML <span class="attribute">version= "<span class="attribute-value">1.0" <span class="attribute">encoding=<span class="attribute-value">"utf-8"<span class="tag">?></span> </span> </span> </span> </span> </span></span></li></li> <li><li><span class="tag"><<span class="tag-name">GridView <span class="attribute">xmlns:android=<span class="attribute-value">"http://schemas.android.com/apk/res/android"</span> </span> </span></span></li></li> <li class="alt"><li class="alt"><span class="attribute">android:id=<span class="attribute-value">"@+id/mygrid"</span> </span></li></li> <li><li><span class="attribute">android:layout_width=<span class="attribute-value">"fill_parent"</span> </span></li></li> <li class="alt"><li class="alt"><span class="attribute">android:layout_height=<span class="attribute-value">"fill_parent"</span> </span></li></li> <li><li><span class="attribute">android:padding=<span class="attribute-value">"10dp"</span> </span></li></li> <li class="alt"><li class="alt"><span class="attribute">android:verticalspacing=<span class="attribute-value">"10dp"</span> </span></li></li> <li><li></li></li> <li class="alt"><li class="alt"><span class="attribute">android:horizontalspacing=<span class="attribute-value">"10dp"</span> </span></li></li> <li><li><span class="attribute">android:numcolumns=<span class="attribute-value">"auto_fit"</span> </span></li></li> <li class="alt"><li class="alt"><span class="attribute">android:columnwidth=<span class="attribute-value">"60dp"</span> </span></li></li> <li><li><span class="attribute">android:stretchmode=<span class="attribute-value">"columnWidth"</span> </span></li></li> <li class="alt"><li class="alt"></li></li> <li><li><span class="attribute">android:gravity=<span class="attribute-value">"center"</span> </span></li></li> <li class="alt"><li class="alt"><span class="tag">/></span></li></li> </ol>Can see getview, and ImageView is the focus that affects the display effect of the Picture. and the number of columns is indeterminate, depending on the width of each imageview and the width of the Screen. Next look at Imageview.<strong><strong>ImageView</strong></strong>: Displays an arbitrary image, such as an Icon. The ImageView class can load images from various sources (such as resources or content providers), takes care of computing Its measurement from the image so the it can is used in any layout manager, and provides various display options such as Scaling and Tinting.    ImageView is used to show the Image,icon. Here we focus on understanding ImageView's attribute android:scaletype, namely Imageview.setscaletype (imageview.scaletype). Android:scaletype is a size that controls how the picture resized/moved to the IMAGEVIEW. The meaning difference of imageview.scaletype/android:scaletype value:<strong><strong>Center/center</strong></strong>Centered on the original size of the picture, when the picture is longer/wider than the length/width of the view, the center portion of the image is displayed<strong><strong>Center_crop/centercrop</strong></strong>Proportionally enlarges the size of the image so that the image is long (wide) equal to or greater than the length (width) of the View<strong><strong>Center_inside/centerinside</strong></strong>Center the contents of the picture in full, by scaling it down or the original size to make the picture long/wide equal to or less than the length/width of the view<strong><strong>Fit_center/fitcenter</strong></strong>Enlarges/shrinks the image to the width of the view, centered on the display<strong><strong>Fit_end/fitend</strong></strong>Enlarges/shrinks the image to the width of the view, displayed in the lower part of the view<strong><strong>Fit_start/fitstart</strong></strong>Enlarges/shrinks the image to the width of the view, displayed in the upper part of the view<strong><strong>Fit_xy/fitxy</strong></strong>Put the picture<span style="text-decoration: underline;"><span style="text-decoration: underline;">do not proportionally</span></span>Enlarge/shrink to view size display<strong><strong>Matrix/matrix</strong></strong>Using a matrix to draw a start I do not understand matrix matrices, the web search found that the original matrix matrices can be scaled to zoom the image to display, here do not expand in-depth understanding, just paste the relevant statements, reduce the image: <ol class="dp-j"> <li class="alt"><li class="alt"><span class="comment">Get the high and wide bitmap</span></li></li> <li><li><span class="keyword">int Bmpwidth=bmp.getwidth ();</span></li></li> <li class="alt"><li class="alt"><span class="keyword">int Bmpheight=bmp.getheight ();</span></li></li> <li class="alt"><li class="alt"></li></li> <li><li><span class="comment">Set scale down</span></li></li> <li class="alt"><li class="alt"><span class="keyword">Double scale=<span class="number">0.8;</span></span></li></li> <li><li><span class="comment">Figure out the scale to be narrowed down.</span></li></li> <li class="alt"><li class="alt">Scalewidth= (<span class="keyword">float) (scalewidth*scale);</span></li></li> <li><li>scaleheight= (<span class="keyword">float) (scaleheight*scale);</span></li></li> <li><li></li></li> <li class="alt"><li class="alt"><span class="comment">Bitmap object after generating resize</span></li></li> <li><li>Matrix matrix=<span class="keyword">new matrix ();</span></li></li> <li class="alt"><li class="alt">Matrix.postscale (scalewidth, scaleheight);</li></li> <li><li>Bitmap resizebmp=bitmap.createbitmap (bmp, <span class="number">0, <span class="number">0, bmpwidth, bmpheight, matrix, <span class="keyword">true);</span> </span> </span></li></li> </ol>There are many examples of applying imageview, look at the last Framelayout: <ol class="dp-xml"> <ol class="dp-xml"> <li class="alt"><span class="tag"><<span class="tag-name">imageview  </span> </span> </li> <li>     <span class="attribute">android:id=<span class="attribute-value"> "@+id/image"   </span> </span> </li> <li class="alt">    <span class="attribute">android:layout_width= <span class="attribute-value"> "fill_parent"    </span> </span> </li> <li>     <span class="attribute">android:layout_height=<span class="attribute-value"> "fill_ Parent "  </span> </span> </li> <li class=" alt ">    <span class=" attribute ">android: Scaletype=<span class="attribute-value"> "center"   </span> </span> </li> <li>     <span class="attribute">android:src=<span class="attribute-value"> "@drawable/candle"   </span> </span> </li> <li class="alt">    <span class="tag">/>  </span> </li> </ol> </ol>* * To note that, I found that the drawable folder inside the image name can not be Capitalized.<p><p>Android UI Learning-the use of the GridView and ImageView</p></p></span>