Working with GridView and GridLayout - android

Now I have a GridView in my activity which I fill with numbers from a txt file (and inserting via an adapter).
This works perfectly, but I want to add some buttons at the bottom to enable input from the user.
But when I add a button, I get this weird result.
But the result I want to have is this:
How can I accomplish this?
This is my current layout XML code:
<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=".LevelSpelen" >
<GridView
android:id="#+id/gridView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView1"
android:columnWidth="#dimen/activity_horizontal_margin"
android:numColumns="3"
android:verticalSpacing="#dimen/activity_vertical_margin" >
</GridView>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/gridView1"
android:layout_marginLeft="18dp"
android:text="" />
What do you guys suggest? A gridLayout or something else?
Please let me know!

Related

Android listview overlaps edit text field when keyboard shows

I am new to android programming so please bear with me...
I am trying to create a chat UI in android, for that I need to have an edittext field and send message button at bottom and listview (of message) at the rest of the screen (top to just above edittext and send message button). I am able to create the UI for that but when i show keyboard, the last message in listview overlaps the edittext field.
Here's my code:
<?xml version="1.0" encoding="utf-8"?>
<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="codes.electrux.lets_start_android.PostAuthenticate">
<ListView
android:layout_width="wrap_content"
android:layout_height="410dp"
android:id="#+id/listView" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true">
<EditText
android:id="#+id/edit_msg"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:hint="#string/msg_to_send"
android:layout_gravity="bottom" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send"
android:layout_gravity="bottom"
android:onClick="sendMessage" />
</LinearLayout>
</RelativeLayout>
Here's what happens when keyboard shows up:
Here's what it looks like without keyboard:
I tried all solutions I could find on stackoverflow, but honestly, couldn't understand most of them.
Please help,
Thanks and Regards,
electrux.
Try like this.
Here your linear layout will be contains within the list view so it is overlaying last item of list. Just change as below and it will work.
Just replace this code with your xml.
<?xml version="1.0" encoding="utf-8"?>
<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="codes.electrux.lets_start_android.PostAuthenticate">
<ListView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="410dp"
android:layout_above="#+id/linearLayout" />
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_alignParentBottom="true">
<EditText
android:id="#+id/edit_msg"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1"
android:hint="Send Msg" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:onClick="sendMessage"
android:text="Send Data" />
</LinearLayout>
</RelativeLayout>
And it's Done.
Hope this will help you.
Try to do like the following,
Just change the list height from default to wrap_content,
And give a id to the linearLayout , make the listView to be placed above LinearLayout.
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView"
android:layout_above="#+id/test"/>
<LinearLayout
android:id="#+id/test"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
The first thing you should do is set the ListView to match_parent widht and height.
The next, in your manifest you should declare your activity like this:
<activity android:name=".ConversationChatActivity"
android:windowSoftInputMode="adjustResize"
>
and in the activity the listView should apply this:
listview = (ListView) this.findViewById(R.id.listMessages);
listview.setTranscriptMode(ListView.TRANSCRIPT_MODE_NORMAL);
listview.setStackFromBottom(true);
Hope it helps you!!

Android: How to create a specific horizontal linear layout

I am making an app where there is a custom search bar. I want there to be a search part that is big, a spinner for region selection that is a small square, and a search button that is also a small square.
Here is what I am talking about.
The code I have right now is this:
<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:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<EditText
android:hint="#string/summoner_name"
android:layout_width="wrap_content"
android:layout_weight="75"
android:layout_height="wrap_content"
android:id="#+id/summoner_name"/>
<Spinner
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/regions">
</Spinner>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/search_button"/>
</LinearLayout>
However, this makes the search half the screen, and the button for 2/5's the screen, and the spinner for a smaller ammount. Anyone know how to accomplish this?
Thanks :)
give weight 1 to EditText android:layout_weight="1" , and remove weight tags from other components.
Also you will require to set Spinners width statically, if above doesnt work because of Spinner's width part
like this?
<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:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity"
android:orientation="vertical">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:layout_width="wrap_content"
android:layout_weight="75"
android:layout_height="wrap_content"
android:id="#+id/summoner_name"/>
<Spinner
android:layout_weight="1"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:id="#+id/regions"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/search_button"/>
</LinearLayout>
</LinearLayout>

android Layout - scrollview don't show

I have a ScrollView which contains EditText, but the problem is it doesn't show properly in the emulator and on a physical device. Can anyone see any problems with my code?
XML snippet
<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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
android:background="#drawable/background2"
tools:context="com.jack.cheng.buddhistcopy.Activity1">
<ScrollView
android:layout_width="300dp"
android:layout_height="300dp"
android:id="#+id/scrollView"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:fillViewport="true"
android:isScrollContainer="true"
android:saveEnabled="true">
<TableLayout
android:id="#+id/sutra"
android:layout_width="295dp"
android:layout_height="295dp"
android:orientation="vertical"
>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:text="Test"
android:layout_width="10dp"
android:layout_height="10dp"
>
</EditText>
</TableRow>
</TableLayout>
</ScrollView>
</RelativeLayout>
Did you try adding the following attribute to the ScrollView?
xmlns:android="http://schemas.android.com/apk/res/android"
Try using:
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="TestText"
/>
You might want to use the conditions : wrap_content, fill_parent or match_parent as using these allows your view elements to adjust accordingly to the device screen which can vary.
Also you might want to add an android:id="#id/myIdentifier" to that EditText so you can link it to whatever process you have going on in your app.

How to Clone a Relative Layout in Android?

this is my XML code
<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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity">
<RelativeLayout
android:id="#+id/RelativeLayout01" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:id="#+id/search_text"
android:layout_alignParentRight="true"
android:text="Download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<EditText android:id="#+id/search_box"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#id/search_text"
android:layout_centerVertical="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="Paste Link Here"
android:inputType="text"
android:maxLines="1" />
</RelativeLayout>
</RelativeLayout>
i need to clone the inner part of code, i mean i want to create 4 row like first row , and i need to show this link and download button of inner relative layout 4 time,under the first one, like a list
how can i clone and show 5 of this relative view in my main page?
i want to copy this relative view just under the first one,and third one just under the second one and ...
its better to add them dynamically from code. Tomorrow you might think to give 6 or 8 download links... :) Use addView() method.
See this http://developer.android.com/reference/android/view/ViewGroup.html#addView%28android.view.View%29
Create a new row.xml to represent each row
<RelativeLayout
android:id="#+id/RelativeLayout01" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:id="#+id/search_text"
android:layout_alignParentRight="true"
android:text="Download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<EditText android:id="#+id/search_box"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#id/search_text"
android:layout_centerVertical="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="Paste Link Here"
android:inputType="text"
android:maxLines="1" />
</RelativeLayout>
And then use to replicate it in your main layout
<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:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity"
android:orientation="vertical">
<include layout="#layout/row" id="#+id/row1" />
<include layout="#layout/row" id="#+id/row2" />
<include layout="#layout/row" id="#+id/row3" />
<include layout="#layout/row" id="#+id/row4" />
</LinearLayout>
For more information on reusing android layouts, have a look here Re-using layuts
As mentioned in a comment above, if you have no specific reason to do it this way, you should use a listview instead or a gridlayout or another UI element that fits your needs

Android: View not at the right place

I got a little problem: I can't put views to the verry right or to the verry left of my screen... In the graphical layout preview of eclipse, it looks like this:
If I upload it to my Galaxy Tab 3 (10.1"), it looks exactly the same...
Here's the XML-Code:
<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:id="#+id/layout"
tools:context=".MainActivity" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:gravity="left"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</RelativeLayout>
As you can see, android:layout_alignParentLeft and android:layout_alignParentTop are set to true...
#dimen/activity_vertical_margin and #dimen/activity_horizontal_margin have their default value of 16dp.
It don't concerns just TextViews, but also every other view I tried out. If I select other screen sizes than 10.1", the view is at the right place.
Anybody can help me?
Thank you!
Try this:
<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:id="#+id/layout"
tools:context=".MainActivity" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:gravity="left"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
You have given padding to the parent layout. That's why you couldn't place your view close to left.
Remove these lines from your RelativeLayout
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
Remove the paddings of your Relative Layout
<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:id="#+id/layout"
tools:context=".MainActivity" >

Categories

Resources