How to arrange the rows and columns in gridview in android? [duplicate] - android

This question already has an answer here:
Closed 10 years ago.
Possible Duplicate:
How to set a row for grid-view in android?
Now i am displaying the data from XML file in to grid view in android.This is the exact xml's file link
"http://54.251.60.177/StudentWebService/StudentDetail.asmx/GetTMSOrders"
which i am trying to show.
I have done that concept successfully, but here the problem is,i am not getting the answer like the below image
i need to show like the below image, in android
but i am getting only like the below image.....
![enter image description here][3]
How to overcome this concept?can any one please make me clear?
thanks for your precious time!..

Try the below layout in your code has grid_layout.xml, it may help you a while.Better to use Listview for these kind of implementation.
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/grid_view"
style="#style/gridViewStyle" />
under styles.xml place the below code
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<!-- GridView Style -->
<style name="gridViewStyle">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">fill_parent</item>
<item name="android:columnWidth">60dp</item>
<item name="android:gravity">center</item>
<item name="android:horizontalSpacing">10dp</item>
<item name="android:numColumns">3</item>
<item name="android:padding">10dp</item>
<item name="android:stretchMode">columnWidth</item>
<item name="android:verticalSpacing">10dp</item>
</style>
</resources>
place your relevant Listitems in your grid_items.xml has below
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/widget44"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="201px"
android:layout_y="165px"
android:gravity="center_horizontal"
android:orientation="vertical" >
<TextView
android:id="#+id/icon_image"
style="#style/wrapViewScale"/ >
<TextView
android:id="#+id/icon_text"
style="#style/wrapViewScale"
android:gravity="center_horizontal"
android:textColorHighlight="#color/text_color_highlight" />
</LinearLayout>

stick with gridview , and change the childview by inflating custom xml file

Related

Custom buttons doesn't display android studio

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
android:orientation="vertical"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ImageButton Selected"/>
<Button
android:id="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/button"/>
This is in my activity_main.xml
and this
<item android:drawable="#drawable/round" android:state_pressed="true"/>
<item android:drawable="#drawable/round2" android:state_focused="true"/>
in my button.xml
the custom buttons are made with image button function
when I start the application It doesn't give error and shows only "imagebutton selected"
The problem can be with my image?being too large?
here are the images and they are png btw with 1000x1000..I know is big but being png I thought will be everything fine..now I have to find how to make the white background dissapear.
here are the images round and round2
I don't know what is a selector,I know that I've put them in the folder drawable and then I followed a tutorial to make custom buttons.
the images are vectors
here is how the emulator looks like emulator
Your button.xml should look like this.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- pressed -->
<item android:drawable="#drawable/round2" android:state_pressed="true"/>
<!-- focused -->
<item android:drawable="#drawable/round3" android:state_focused="true"/>
<!-- default -->
<item android:drawable="#drawable/round"/>
</selector>
Also, you should reduce the size of your PNGs, that would take up a lot of space, and a lot of memory.

Using <include> in android.support.v7.widget.GridLayout not displaying correctly

I'm trying to use <include> to include ImageButtons inside a android.support.v7.widget.GridLayout. The problem is, if I don't specify all the attributes explicitly on my <include> elements, they don't display properly. In other words, the include is pointless since I have to redeclare all the attributes on every <include> element.
dialpad_button.xml
<?xml version="1.0" encoding="utf-8"?>
<ImageButton
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:grid="http://schemas.android.com/apk/res-auto"
android:layout_width="0dp"
android:layout_height="0dp"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_gravity="fill"
android:layout_margin="5dp"
android:scaleType="centerInside"/>
dialpad_view.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:grid="http://schemas.android.com/apk/res-auto"
android:id="#+id/dialpad_grid_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
grid:alignmentMode="alignBounds"
grid:columnCount="2"
grid:rowCount="1">
<include
android:id="#+id/dialpad_view_btn1"
android:src="#drawable/dialpad_1"
layout="#layout/dialpad_button" />
<include
android:id="#+id/dialpad_view_btn2"
android:src="#drawable/dialpad_2"
layout="#layout/dialpad_button" />
</android.support.v7.widget.GridLayout>
If I declare all the attributes directly on the <include>s, here's what it looks like in XML:
<include
layout="#layout/dialpad_button"
android:id="#+id/dialpad_view_btn1"
android:src="#drawable/dialpad_1"
android:layout_width="0dp"
android:layout_height="0dp"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_gravity="fill"
android:layout_margin="5dp"
android:scaleType="centerInside" />
As you can see in the comparison image below, the buttons now scale properly but the images are nowhere to be seen.
And if I change the <include>s to ImageButton, things work as expected.
<ImageButton
android:id="#+id/dialpad_view_btn1"
android:src="#drawable/dialpad_1"
android:layout_width="0dp"
android:layout_height="0dp"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_gravity="fill"
android:layout_margin="5dp"
android:scaleType="centerInside" />
Is there a workaround to this?
Since I'm going to have 12 near-identical buttons in my dialpad, I'd really like to clean the XML up by including a "template" and only modifying the necessary attributes for each button (i.e. src and id).
EDIT
Trying to use styles, as suggested in one answer, did not work. None of the views that I applied the styles to get displayed. What's even more strange, even if I just apply the style to one of the views in the GridLayout, only the last view gets displayed (I've shortened down the sample code here to only two views for readability, in reality I have twelve).
Here's the style I tried using:
<?xml version="1.0" encoding="utf-8"?>
<resources
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:grid="http://schemas.android.com/apk/res-auto" >
<style name="dialPadButtonStyle">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">0dp</item>
<item name="grid:layout_columnWeight">1</item>
<item name="grid:layout_rowWeight">1</item>
<item name="grid:layout_gravity">fill</item>
<item name="android:layout_margin">5dp</item>
<item name="android:scaleType">centerInside</item>
<item name="android:background">#android:color/transparent</item>
</style>
</resources>
Maybe you can use a style to declare the common attributes and then set it for every button.
<style name="dialPadButtonStyle">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">0dp</item>
<item name="android:layout_columnWeight">1</item>
<item name="android:layout_rowWeight">1</item>
<item name="android:layout_margin">5dp</item>
<item name="android:src">#android:drawable/ic_menu_camera</item>
</style>
I also added: columnCount to 3 and rowCount to 4 for GridLayout and added 12 ImageButtons with that style. The final result is this:

highlight selected item on listview

before someone marked this question as duplicate, I must say I already know that this question is already asked several times, but every time I tried I always failed.
so I have a listview of date on the left and I want to show data on the right, I want to make a listview that can show which item is selected so I know which date that I picked.
So far I've tried this;
on listview I've added android:choiceMode="singleChoice";
<ListView
android:id="#+id/listTglRMPasien"
android:layout_width="180dp"
android:layout_height="wrap_content"
android:layout_above="#+id/btnObatAlkes"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:choiceMode="singleChoice">
</ListView>
on item of listview I've added android:background="#drawable/list_selector";
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/txtListRekamMedikTanggal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/emptyString"
android:textAppearance="?android:attr/textAppearanceLarge"
android:background="#drawable/list_selector"/>
<TextView
android:id="#+id/txtListRekamMedikTabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/emptyString"
android:textAppearance="?android:attr/textAppearanceLarge"
android:visibility="gone" />
</LinearLayout>
and on list_selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/ic_launcher" android:state_activated="false"/>
<item android:drawable="#drawable/ic_launcher" android:state_pressed="false"/>
<item android:drawable="#drawable/blue" android:state_pressed="true"/>
<item android:drawable="#drawable/blue" android:state_activated="true"/>
</selector>
note that ic_launcher and blue here are png file, it's supposed to be "#drawable/listitem_pressed" and "#drawable/solid_white", I find this answer from here
but somehow it got an error, it says No resource found that matches the given name and I think something is missing so I changed it to png file
anyway, when I tried to run this, it always show ic_launcher whether I select it or not, it never show blue.
apparently it happens because my API level is too low, I changed it from API level 8 to API level 14.
this is a good answer about how to change min. API level for your Android app in Eclipse
Here is what I did on my ListView. Create your own theme on res/values folder, you can name it for example mytheme.xml. Here what I added on mytheme.xml
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="mytheme" parent="android:Theme.Holo.Light">
<item name="android:textColor">#fff</item>
</style>
</resources>
Then in your Manifest add this android:theme="#style/mytheme" inside the activity of your ListView Class.
Hope it helps.

Using selectors for image view in android

I have around 6 images which i am using as tabs in my application.Its just images and they aren't the tabs that android provides.
So my question is that when i click on a image i want replace the image with a another image so that it can let user know that which tab is selected.
What i am did was creating different xml for this it in my layout.But its tedious to do so since I can't be creating different xml's for every image.
What i am trying to do now is using for this but not getting the result.
How is it possible to use for this ?
Its quite simple.You dont have to make different xml for each image/tab.you just have to make one xml and include this xml in every xml which needs these images..in the xml set only one image as selected and the rest unselected.Suppose for the image1 keep image1 selected and the rest unselected.by clicking image2 will redirect to activity2.In activity2 set image2 selected and the rest unselected and the same for the remaining activities.This way will be the easiest way.Trust me i have implemented this and will help you too.any sort of queries you can ask me.
i have done with 4 images but in your case there will be 6.
<?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="wrap_content">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/btn1"
style="#style/toolButton"
android:background="#drawable/image1"
android:gravity="center"
/>
<Button
android:id="#+id/btn2"
style="#style/toolButton"
android:background="#drawable/image2"
android:gravity="center"
/>
<Button
android:id="#+id/btn3"
style="#style/toolButton"
android:background="#drawable/image3"
android:gravity="center"/>
<Button
android:id="#+id/btn4"
style="#style/toolButton"
android:background="#drawable/image4"
android:gravity="center"
/>
</LinearLayout>
</RelativeLayout>
And here is style.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="toolButton">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">45dip</item>
<item name="android:gravity">center_horizontal</item>
<item name="android:layout_gravity">center_vertical</item>
<item name="android:layout_weight">5</item>
<item name="android:layout_marginBottom">0dip</item>
<item name="android:layout_marginTop">0dip</item>
</style>
</resources>

Defining IDs within style, is it safe or a disaster?

Following question has kept me puzzled for a while and I thought maybe asking about this does no harm. I have the following layout.xml and style.xml files;
res/layout/layout.xml
<?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" >
<LinearLayout
style="#style/headerContainer" />
<LinearLayout
style="#style/footerContainer" />
<ScrollView
style="#style/contentContainer" />
</RelativeLayout>
res/values/style.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="container">
<item name="android:layout_width">fill_parent</item>
</style>
<style name="headerContainer" parent="container">
<item name="android:layout_height">40dp</item>
<item name="android:layout_alignParentTop">true</item>
<item name="android:background">#80FF0000</item>
<item name="android:id">#+id/header</item>
</style>
<style name="footerContainer" parent="container">
<item name="android:layout_height">50dp</item>
<item name="android:layout_alignParentBottom">true</item>
<item name="android:background">#8000FF00</item>
<item name="android:id">#+id/footer</item>
</style>
<style name="contentContainer" parent="container">
<item name="android:layout_height">60dp</item>
<item name="android:layout_below">#id/header</item>
<item name="android:layout_above">#id/footer</item>
<item name="android:background">#800000FF</item>
</style>
</resources>
Now, the question is, is there a danger of overlapping IDs as I'm introducing them in style.xml? Funny thing is that this approach works, on the emulator I'm using at least, but the created IDs are not being added to the R class. And I'm a bit confused how they are defined once my layout is inflated.
Don't use #+id/... in styles.
#+id/... can only be used in layouts.
Otherwise you can get Error executing apt: return code 139 during build.
Use #id/... and generate ids with help resource file if needed:
res/values/ids.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<item type="id" name="header" />
<item type="id" name="footer" />
</resources>
http://developer.android.com/guide/topics/resources/more-resources.html#Id
Its not safe my friend. You should use different id for different files. Here the emulator will not act problem. It will understand because for every xml file there is unique code defined R.java file automatically. So emulator will understand from there very easily. But if you need to improve or edit the code for any up gradation surely you will get confused which id is belonging to which xml file's layout or wedged. So provide unique id to every widget of layout. It will be helpful if you provide the id including some tag of respective file name.
Example: If file name is filldetails.xml then you can use id=#+fd_name
It will be helpful to know the flow of application.
I am doing it this way and have had good luck:
Layout
res/layout/main.xml
<?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"
>
<include layout="#layout/action_bar"/>
</RelativeLayout>
Common:
res/layout/action_bar.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/action_bar_container"
android:layout_width="fill_parent"
android:layout_height="#dimen/action_bar_height"
android:layout_alignParentTop="true"
android:paddingLeft="5dip"
android:paddingRight="5dip"
>
<TextView
android:id="#+id/action_bar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:textSize="20dip"
android:textStyle="bold"
/>
</RelativeLayout>

Categories

Resources