CODEWITHSUNDEEP
androidgridviewstyles
TutenStain
TutenStain

Reputation: 247

Styled gridview with border android

Im creating a gallery type app. I have the basics up and running where all the pictures is loaded from the phone and gets displayed in a gridview. I want each images in the gridview to have a border, probably a white so that they stand out a bit from the black background. I want to achieve something like this gridview that new Instagram uses, but maybe not so advanced with shadows around them. I have searched the net but I have not found anything. Thanks!

Upvotes: 0

Views: 10627

Answers (1)

Arif Nadeem
Arif Nadeem

Reputation: 8604

Create an xml file named stroke.xml in drawable folder,

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
   <solid android:color="#ffffff" />
   <stroke android:width="1dip" android:color="#4fa5d5"/>
</shape>

And set the background of your ImageView which you use in your GridView, to that xml file.

EDIT: If you want to see the orange or blue color when you click the GridView item, you would have to specify the properties of the ImageView as follows..

<ImageView
        android:id="@+id/ivHighThumbnail"
        android:layout_width="80dip"
        android:layout_height="80dip"
        android:background="@drawable/stroke" 
        android:scaleType="fitXY"
        android:layout_margin="10dip" />

Here please take notes of the properties 

android:scaleType="fitXY"
android:layout_margin="10dip"

That is what makes your item feel like its being clicked and its highlighted.

Also include this xml part in stroke.xml file 

<padding
        android:bottom="2dp"
        android:left="2dp"
        android:right="2dp"
        android:top="2dp" />

For better looking results...

Upvotes: 4

Related Questions