Button completely disappears when placed below gridview despite numerous configurations - android

I have a view in which i'd like a button to be placed below a grid view and fill up the remaining space. The view is a relative layout, and no matter what attributes I give it, if I some how relate the button to the grid view, it disappears. It only appears if I place it in the relative view with it aligned parent bottom, but then it doesn't stretch. The solution I thought would be most likely, though it didn't work either, was to place the button in the relative view, alignParentBottom=True and then layout_below="id/gridview" (all that is psuedo code). This is my code right now:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#drawable/pin_fragment_background"
tools:context="com.lab125.viva_app.MainActivity$PlaceholderFragment" >
<TextView
android:id="#+id/section_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/audioPIN_marquee"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="15dp"
android:paddingBottom="30dip"
android:gravity="center"
android:textSize="15sp"
android:textStyle="bold"
/>
<LinearLayout
android:id="#+id/keypad_wrapper"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_below="#id/audioPIN_marquee">
<GridView
android:id="#+id/keypad"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnWidth="90dp"
android:gravity="center"
android:horizontalSpacing="5dip"
android:verticalSpacing="5dip"
android:numColumns="3"
android:stretchMode="columnWidth" />
<Button
android:id="#+id/start_ver_btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="15sp"
android:textStyle="bold"
android:text="#string/Start_Ver_Button"
android:background="#drawable/button_style" />
</LinearLayout>
<Button
android:id="#+id/audio_playback_btn"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/keypad_wrapper"
android:text="play"
android:textSize="15sp">
</Button>
</RelativeLayout>
Again, with this code, the button does not show at all.
Edit: #Dave's suggestion was correct, and I could see the button after setting the orientation to vertical. However, the only reason I had placed the gridView in a linear layout in the first place was in attempt to just not have the button disappear when having its android:layout_below property to the gridView (by setting its android:layout_below to something else). The more accurate fix for what I wanted to do however, was to not have the gridView's width and height set to match_parent, which was the root cause behind why the button was disappearing. So, i set the gridView's height to wrap content, but that caused the grid to shrink to the point where each grid element's content was no longer visible. I found that the cause of that was => I was programmatically setting the width and height of the gridview to wrap its content, and then the width and height of the components inside by the width and height of the parent view. Realized that was quite cyclical which may be why the gridview was shrinking when I set it to wrap content. I then set the width and height of the grid Elements based on the dimensions of the screen, which fixed the size of the gridView. So everything pretty much works now.
Here is my new layout, if anyone is interested.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#drawable/pin_fragment_background"
tools:context="com.lab125.viva_app.MainActivity$PlaceholderFragment" >
<TextView
android:id="#+id/section_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/audioPIN_marquee"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginBottom="20dp"
android:paddingTop="15dp"
android:gravity="center"
android:textSize="15sp"
android:textStyle="bold"
/>
<GridView
android:id="#+id/keypad"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/audioPIN_marquee"
android:layout_marginTop="10dp"
android:layout_marginBottom="20dp"
android:columnWidth="90dp"
android:gravity="center"
android:horizontalSpacing="5dip"
android:verticalSpacing="5dip"
android:numColumns="3"
android:stretchMode="columnWidth" />
<Button
android:id="#+id/start_ver_btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/keypad"
android:layout_alignParentBottom="true"
android:layout_marginTop="20dp"
android:textSize="15sp"
android:textStyle="bold"
android:text="#string/Start_Ver_Button"
android:background="#drawable/button_style" />
<!--
<Button
android:id="#+id/audio_playback_btn"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/keypad_wrapper"
android:text="play"
android:textSize="15sp">
</Button> -->
</RelativeLayout>

start_ver_btn won't show because the gridview has match_parent for both width and height, judging by your layout_width and heights, I think you want to set the LinearLayout's orientation to vertical.

Related

Resizing GridView on different rotations

just working on a simple layout and I was wondering if there was a way to automatically re-size a gridview?
My vertical rotation view looks like:
But my horizontal rotation view looks like:
The code for my layout at the moment is:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="baegmon.mesmerize.GameActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Timer"
android:id="#+id/textView_Timer"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Score"
android:id="#+id/textView_Score"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Question"
android:layout_weight="1"
android:id="#+id/textView_Question"
android:layout_below="#+id/textView_Timer"
android:layout_centerHorizontal="true" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/textView_Question"
android:layout_alignParentBottom="true">
<GridView
android:id="#+id/gridView_Game"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:columnWidth="100dp"
android:drawSelectorOnTop="true"
android:gravity="center"
android:numColumns="5"
android:stretchMode="columnWidth"
android:verticalSpacing="5dp"
android:clickable="true"
android:layout_centerInParent = "true"
/>
</RelativeLayout>
Is there any way to automatically resize in the Horizontal View so that all of the GridView fits inside of the layout? Any help would be appreciated.
Thank You.
Problem not in GridView size but in GridView cell size.
All cells cannot to fit into screen because of height of every cell is more then needed to fit by height of GridView. Thats why GridView makes your content scrollable.
Just try to change cell size.
Futhermore your cells scretches by width because of android:stretchMode="columnWidth", this is the reason why in second case you have big horizontal spacing between cells.
Try to delete or replace that line.

My scroll view doesn't scroll

I have a xml view like this, and as you see I have scroll view in it, but scroll view doesn't scroll and just match screen size, and I'm not able to see data under the screen.
This is my code:
CODE HAS BEEN UPDATED
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/aboveRelative"
android:background="#color/darkOrange">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/category_text"
android:textSize="23sp"
android:textColor="#color/white"
android:text="Category"
android:paddingLeft="10sp" />
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="match_parent"
android:layout_height="200dp"
android:verticalSpacing="0dp"
android:horizontalSpacing="10dp"
android:numColumns="2"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/gray"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/topVoices"
android:textSize="23sp"
android:text="#string/topVoices"
android:paddingLeft="10sp" />
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/trendlist"
android:elevation="2dp"
android:background="#color/white"
android:layout_margin="10dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/moreTrend"
android:layout_gravity="right"
android:textSize="23sp"
android:text="More"
android:paddingLeft="10sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/newVoices"
android:textSize="23sp"
android:text="#string/newVoices"
android:paddingLeft="10sp" />
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/soundlist"
android:background="#color/white"
android:layout_below="#+id/newVoices"
android:elevation="5dp"
android:layout_margin="10dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/soundlist"
android:id="#+id/moreNew"
android:layout_gravity="right"
android:textSize="23sp"
android:text="#string/more"/>
<LinearLayout
android:id="#+id/yoursongs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center"
android:background="#color/white"
android:padding="10dp">
</LinearLayout>
</LinearLayout>
</LinearLayout>
I'm sure that there are some data under the screen but scroll view doesn't let me scroll it and see them.
Scrollview layout can only have ONE child layout. You still have TWO linear layout children in the XML you posted.
This is explained in the first paragraph of the Android developer documentation for ScrollView:
http://developer.android.com/reference/android/widget/ScrollView.html
Your layout is wrong. Here's what you gotta do:
Change your ScrollView layout_height attribute to match_parent.
The ScrollView will take the whole screen and make itself scrollable, that's why you need it as match_parent. The scrolling happens inside the View.
Put everything inside the ScrollView in a Linear or RelativeLayout. (see below)
The ScrollView extends FrameLayout, so it can only have a single child view.
IMPORTANT: this layout must have the attribute layout_height set to wrap_content, otherwise the ScrollView won't have anything larger than itself to scroll.
I'd also remove the root layout from the XML and leave the ScrollView as root.
Simply because it's pointless and it requires extra work from the LayoutInflater.
EDIT: your layout is also way more complex that it needs to be.
It lead me to believe you did not have a single child inside the ScrollView (which you do).
Still, item #1 should fix your problem.
Finally, I found answer. The problem was from fillviewport in scroll view. if you remove fillviewport and set fix size for listview, you can scroll.

Android textview not fit for all the screen

i developed one of application and now am facing problem that it show perfectly in my nexus7 but when i viewing other device screens the text view not fitting
i want all the screen as same as nexus7. its anyone can know the better solution for this please. unfortunately i don't have enough reputation so i cant post any screenshot here this my xml code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:background="#color/white">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:paddingBottom="16dp"
android:paddingLeft="64dp"
android:paddingRight="64dp"
android:paddingTop="16dp" >
<ImageView
android:id="#+id/pointer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_centerInParent="true"
android:src="#drawable/point" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
android:paddingBottom="16dp"
android:paddingLeft="64dp"
android:paddingRight="64dp"
android:paddingTop="16dp" >
<TextView
android:id="#+id/name2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="97dp"
android:text="#string/numberusers"
android:textColor="#color/no_users"
android:textSize="30sp"
android:textStyle="bold" />
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="19dp"
android:text="#string/number"
android:textColor="#color/no_users"
android:textSize="30sp"
android:textStyle="bold" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingBottom="16dp"
android:paddingLeft="64dp"
android:paddingRight="64dp"
android:paddingTop="355dp" >
<ListView
android:id="#android:id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_gravity="center_horizontal"
android:clickable="false" >
</ListView>
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
I m Not Sure But Remove Relative Layout And Use Linear Layout Its More Better Than Relative
The two textViews that you have in your layout use android:layout_width="wrap_content".
Use android:layout_width="match_parent" in the one you want to fill the screen.
every children relative layout in your xml has height and width as match_parent. Do you need it? Because if first layout have height as match_arent than it will not leave space for others. Try using "wrap_content" as height for inner relative layouts.
If I got your question, you have to set the width of the textview as
android:layout_width="match_parent"
But in my opinion, the hole screen is wrong. Use a LinearLayout (vertical or horizontal) and place there your first two textviews. And if you want more accuracy use the gravity feature in each text view and of course set a layout_weight for each TextView and weightSum in the LinearLayout.

How to make a view fill the extra space in a row?

In android app development, with Linear Layout, I have two buttons side-by-side in a row. I made such an arrangement with TableRow and center aligned it. But the buttons dont fill completely the extra space. How do I make the buttons fill the extra space to the left and to the right?
Here the xml code:
<TableRow
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_margin="7dp"
>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Save"
android:textAlignment="center"
android:id="#+id/save"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cancel"
android:textAlignment="center"
android:id="#+id/cancel"
/>
</TableRow>
The LinearLayout has the following attributes:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:orientation="vertical"
android:layout_alignParentBottom="true"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context="com.appname.classname">
Here is the sample screen shot:
Instead of using the TableRow, use an horizontal LinearLayout inside the vertical LinearLayout. Note that the default orientation of LinearLayout is horizontal. So you can do soemthing like:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/save"
android:text="#string/save"
android:layout_weight="1"
android:layout_width="0dip"
android:layout_height="wrap_content" />
<Button
android:id="#+id/cancel"
android:text="#string/cancel"
android:layout_weight="1"
android:layout_width="0dip"
android:layout_height="wrap_content" />
</LinearLayout>
The layout_weight attribute will make each item occupy the available space in that ration. In this case, the buttons will share the screen space in a 1:1 ratio.
Set the android:layout_marginRight of the first button to "-8dip" or even more. The sspace should be smaller or gone.
You can use RelativeLayout, there are no margins there.

Show 3 scrollable ListViews of equal height in Android Layout

I am trying to show three different vertical sections in my Android layout on one screen, each taking up one third of the screen, one on the top, one in the middle, and one on the bottom. Each section has a TextView and a ListView, and the ListViews can scroll so that you can see all items, but the overall page does not move. I have tried putting each TextView and ListView in a LinearLayout and setting the height of each LinearLayout to one third the total height of the screen, but the first ListView just shows all the items in it, taking up most of the screen, and the other sections are pushed down. I also tried using layout_weights, but for some reason it did not work. (EDIT: Setting layout_weight="1" ended up working, I'm not sure what I did wrong the first time) How can I make this work, or is there a better way to go about this?
<LinearLayout
android:layout_width="match_parent" android:layout_height="match_parent"
android:orientation="horizontal" >
<ListView android:layout_width="0dp" android:layout_weight="1"
android:layout_height="match_parent" android:background="#FF0000"/>
<ListView android:layout_width="0dp" android:layout_weight="1"
android:layout_height="match_parent" android:background="#00FF00">
<ListView android:layout_width="0dp" android:layout_weight="1"
android:layout_height="match_parent" android:background="#0000FF">
</LinearLayout>
This will give you three equally wide columns: to make it rows, change the orientation to vertical and swap the values of layout_height and layout_width for each listview. If you need to add the TextViews, you'll have to make each listview in this code either a RelativeLayout LinearLayout or FrameLayout, using same width/height/weight and arranging the ListView and TextView inside to taste. To do this most efficiently, use a Framelayout and use a margin on the listview to offset it from the TextView. You can place the TextView relative to the ListView inside the FrameLayout by using the layout_gravity in the TextView.
Ie (swapping the first "column"):
<FrameLayout android:orientation="vertical" android:layout_width="0dp"
android:layout_weight="1" android:layout_height="match_parent"
android:background="#FF0000">
<TextView android:text="Column!" android:background="#3Eff0000"
android:layout_height="40dp" android:layout_width="match_parent">
<ListView android:layout_marginTop="48dp" android:layout_height="match_parent"
android:layout_width="match_parent" android:background="#8Aff0000"/>
</FrameLayout>
Use this:
<?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="horizontal"
android:weightSum="3">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ff89ff91">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#1"
android:id="#+id/textView"
android:padding="5dp"
android:gravity="center" />
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView"
android:layout_below="#+id/textView" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ffff8177">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#2"
android:id="#+id/textView2"
android:padding="5dp"
android:gravity="center" />
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView2"
android:layout_below="#+id/textView2" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ffffe85d">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#3"
android:id="#+id/textView3"
android:padding="5dp"
android:gravity="center" />
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView3"
android:layout_below="#+id/textView3" />
</RelativeLayout>
</LinearLayout>

Categories

Resources