The implementation of the Android development GridView paid treasure nine lattice _android

Source: Internet
Author: User
Tags first row

First show you about imitation pay Treasure Wallet home page with a split line of the GridView, commonly known as nine Sudoku effect, how is it like you imagine AH. Continue to visit the following code as you expect.

We all know ListView it is very easy to set the split line, set the ListView color and width, just define the Android:divider and Android:dividerheight properties in the layout. And the GridView has no such attributes and methods, so how do we do that?

The cloud community small weave in doing this effect before, also refer to some other scenarios, such as defining a custom GridView, and then in the Dispatchdraw () method in the next to each item with a split line, which need to rely on the algorithm to achieve, Finally, the effect of this method is not ideal, there will be some item does not add a split line, it is difficult to achieve this effect we want.

In fact, it is not difficult to achieve this effect, the principle is that each item is set with a split line background, so it is easy to achieve.

First we'll write the layout:

 <linearlayout xmlns:android= "Http://schemas.android.com/apk/res/android" Android:layout_width= "Match_parent" android:layout_height= "match_parent" android:orientation= "vertical" > <S 
  Crollview android:layout_width= "fill_parent" android:layout_height= "Wrap_content" android:fillViewport= "true" android:scrollbars= "None" > <com.finddreams.alipay.mygridview android:id= "@+id/gridview" Android:layout_w Idth= "Fill_parent" android:layout_height= "wrap_content" android:horizontalspacing= "0.0dip" Android:listSelecto R= "@null" android:numcolumns= "3" android:scrollbars= "None" Android:stretchmode= "ColumnWidth" Android:verti calspacing= "0.0dip"/> </ScrollView> </LinearLayout> 

Because sometimes our GridView in the item may be more, in order to put it, the general will use a scrollview to nest up. There is a common problem that we often encounter in development, that is, when ListView or GridView are nested in ScrollView, only the first row of data is displayed, and the following data is not displayed. As for the cause of this problem, it may be because the GridView and ListView can be displayed according to the width of the child item size, but once nested into the ScrollView can slide up and down, so the system can not determine exactly how large the painting, it will produce such a problem.

The solution to this problem is a lot of online, generally Baidu can be found, the following is the GridView solution:

public class MyGridView extends the GridView {public 
 MyGridView (context context, AttributeSet Attrs) { 
  super ( context, attrs); 
 } 
 Public MyGridView { 
  super (context); 
 } 
 Public MyGridView (context, AttributeSet attrs, int defstyle) { 
  Super (context, attrs, Defstyle); 
 } 
 @Override public 
 void onmeasure (int widthmeasurespec, int heightmeasurespec) { 
  int expandspec = Measurespec.makemeasurespec (Integer.max_value >> 2, 
    measurespec.at_most); 
  Super.onmeasure (Widthmeasurespec, Expandspec); 
 } 

Next, we define a selector with a split line, and the code is:

<?xml version= "1.0" encoding= "Utf-8"?> <selector xmlns:android= "http://schemas.android.com/apk/res/" Android "> <item android:state_pressed=" true "><shape android:shape=" Rectangle "> <stroke android:wi Dth= "1.0px" android:color= "@color/line"/> <gradient android:angle= "270.0" android:endcolor= "#ffe8ecef" Android:startcolor= "#ffe8ecef"/> </shape></item> <item android:state_focused= "true" >< Shape android:shape= "Rectangle" > <gradient android:angle= "270.0" android:endcolor= "#ffe8ecef" Android: Startcolor= "#ffe8ecef"/> <stroke android:width= "1.0px" android:color= "@color/line"/> </shape></ item> <item><shape android:shape= "Rectangle" > <gradient android:angle= "270.0" # FFFFFFFF "android:startcolor=" #ffffffff "/> <stroke android:width=" 1.0px "android:color=" @color/line "/> &  Lt;/shape></item> </selector>

Define a selector that sets a shape to a rectangular rectangle, sets the color of the stroke stroke property of the rectangle to the color of the split line, and then sets the different gradient gradient properties in the item of the different state. This enables the effect of a single item to be clicked when selected.

Then we add the background to the item layout of the GridView:

<?xml version= "1.0" encoding= "Utf-8"?> <relativelayout xmlns:android= "http://schemas.android.com/apk/res/" Android "Android:layout_width=" Fill_parent "android:layout_height=" fill_parent "android:layout_margin=" 0.0dip "and roid:background= "@color/griditems_bg" > <relativelayout android:layout_width= "fill_parent" android:layout_he ight= "Fill_parent" android:layout_centerinparent= "true" android:background= "@drawable/bg_gv" android:padding= "12. 0dip "> <imageview android:id=" @+id/iv_item "android:layout_width=" 58.0dip "android:layout_height=" 58 
   .0dip "android:layout_centerhorizontal=" true "android:contentdescription=" @string/app_name "/> <textview Android:id= "@+id/tv_item" android:layout_width= "wrap_content" android:layout_height= "Wrap_content" Android : layout_below= "@id/iv_item" android:layout_centerhorizontal= "true" android:layout_margintop= "5.0dip" android:m axlines= "1" Android:textcoLor= "@color/commo_text_color" android:textsize= "14.0sp"/> </RelativeLayout> </RelativeLayout>  

      Here, we're going to start writing code, defining a adapter, populating the data in the GridView, and I think we should all be very clear here, and I don't know what to say, You can refer to the project code below.

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.