I am having a heck of time trying to get my UI to look the way I want. Here's what I've got ...
I would like the TextView, the XX:XX:XX, text font to be larger and centered between the EditText and Button. Also how come the user gets the phone keyboard instead of a qwerty keyboard to use to enter text?
Here's my layout XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:id="#+id/new_bookmark_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.5"
android:ems="10"
android:inputType="text" />
<TextView
android:id="#+id/new_bookmark_clock"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.3"
android:text="#string/xx_xx_xx" />
<Button
android:id="#+id/btn_add_new_bookmark"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.2"
android:text="#string/add"/>
</LinearLayout>
<ListView
android:id="#+id/bookmark_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
Use the following code to achieve what you want:......
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:id="#+id/new_bookmark_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:ems="10"
android:inputType="text" />
<TextView
android:id="#+id/new_bookmark_clock"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="18dp"
android:layout_weight="1"
android:text="#string/xx_xx_xx" />
<Button
android:id="#+id/btn_add_new_bookmark"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="#string/add"/>
</LinearLayout>
<ListView
android:id="#+id/bookmark_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
please refer this xml all the changes is done tested is also done.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:id="#+id/new_bookmark_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:ems="10"
android:inputType="number" />
<TextView
android:id="#+id/new_bookmark_clock"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal|center_vertical"
android:textSize="18dp"
android:layout_weight="1"
android:text="hello" />
<Button
android:id="#+id/btn_add_new_bookmark"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="add"/>
</LinearLayout>
<ListView
android:id="#+id/bookmark_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
You can use relative layout to do that. You can change the font size with android:textSize
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<EditText
android:id="#+id/new_bookmark_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:ems="10"
android:inputType="text" />
<TextView
android:id="#+id/new_bookmark_clock"
android:layout_width="wrap_content"
android:layout_toRightOf="#id/new_bookmark_name"
android:layout_toLeftOf="#+id/btn_add_new_bookmark"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="#string/xx_xx_xx" />
<Button
android:id="#id/btn_add_new_bookmark"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="#string/add"/>
</RelativeLayout>
Replace android:layout_gravity="center" by
android:gravity="center" in your TextView.
and regarding the keyboard layout, it looks like you are trying in the emulator. The emulator shows up 12pad keyboard in portrait mode. You can try in the device.
Please follow below, i have made a sample UI exactly what you have asked for using Relative Layout and by using minimum number of lines. Please have a look and check if can solve the purpose. I have also attached snapshot for the same.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:padding="4dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<EditText
android:id="#+id/ed_name"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:inputType="number" />
<TextView
android:id="#+id/tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/ed_name"
android:text="XX:XX:XX"
android:textSize="18dp" />
<Button
android:id="#+id/btn_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text=" add " />
</RelativeLayout>
</RelativeLayout>
About the keypad :Check it on actual device , the device will open its own default keypad.
Related
I want to create a Layout that have the feature of expand and collapse .Expand should be like that at a time only one row can be expanded ,if user clicks on other first should be closed by itself.In each row i have to show different layout design .
Please help me in this ,i have searched but i am not getting i how could i create this functionality .Please take this as a reference how it will be like .Please suggest me the best approach to get this
You can use a lib Accordion-View screenshot is :
I have implemented some code as the answer suggested by #Super User. So from that i think you will sure get your solution.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:accordion="http://schemas.android.com/apk/res-auto/com.sentaca.android.accordion"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/white"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/main_header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="#ff0000"
android:orientation="horizontal" >
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="Offline Booking Request"
android:textColor="#fff"
android:textStyle="bold" />
</LinearLayout>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<com.sentaca.android.accordion.widget.AccordionView
android:id="#+id/accordion_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
accordion:header_layout_fold_button_id="#id/foldButton"
accordion:header_layout_id="#layout/accordion_header"
accordion:header_layout_label_id="#id/foldText"
accordion:section_bottom="#layout/accordion_footer"
accordion:section_container="#layout/accordion_section"
accordion:section_container_parent="#id/section_content"
accordion:section_headers="#array/accordion_sections"
accordion:section_visibility="#array/accordion_visibility"
android:background="#fff5f5f5"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Please specify offline car details if you need any cars of travels"
android:textSize="14sp" />
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="45dp"
android:text="Plase click the checkbox to send the details"
android:textColor="#ff0000" />
<include layout="#layout/radio" >
</include>
</LinearLayout>
<LinearLayout
android:id="#+id/example_get_by_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Item 2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Item 3" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Item 4" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RatingBar
android:id="#+id/ratingBar1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<SeekBar
android:id="#+id/seekBar1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Item 4" />
</com.sentaca.android.accordion.widget.AccordionView>
</ScrollView>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Review" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Confirm" />
</LinearLayout>
</LinearLayout>
Now just remember one thing whenever you want to add layout items then add item in Linear Layout and make different layout for different sections and after that include that layout in your Linear layout. I have tried for one section named radio.xml file which is included in Linear Layout above.
radio.xml
<?xml version="1.0" encoding="utf-8"?>
<RadioGroup
android:id="#+id/radioGroup1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:orientation="horizontal" >
<RadioButton
android:id="#+id/radio0"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:checked="true"
android:text="Domestic"
android:textColor="#ff0000" />
<RadioButton
android:id="#+id/radio1"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:text="InterNational"
android:textColor="#ff0000" />
</RadioGroup>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Pick Up Location"
android:textAppearance="?android:attr/textAppearanceSmall" />
<EditText
android:id="#+id/editText1"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_gravity="center"
android:layout_weight="1"
android:ems="10" >
<requestFocus />
</EditText>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="DropLocation"
android:textAppearance="?android:attr/textAppearanceSmall" />
<EditText
android:id="#+id/editText2"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_gravity="center"
android:layout_weight="1"
android:ems="10" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:text="Car Type"
android:textColor="#000" />
<Spinner
android:id="#+id/spinner1"
android:layout_width="0dp"
android:layout_height="35dp"
android:layout_gravity="center"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:text="Remarks"
android:textColor="#000" />
<EditText
android:id="#+id/editText3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ems="10"
android:inputType="textMultiLine" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
You can start with ExpandableListView and customize it to your need. I think this would be a good way to start. Please follow a link below to customize ExpandableListView :
http://androidexample.com/Custom_Expandable_ListView_Tutorial_-_Android_Example/index.php?view=article_discription&aid=107&aaid=129
You can google for more links on customizing expandablelistview. Hope it helps.
You can use scaleAnimation where you can add in each section a layout panel and inside the layout textview or anything as your requirement. See this. Hope it might help you.
http://wwwpriyaandroid.blogspot.in/2013/10/accordion.html
I'm using a layout for a configuration panel comprising a LinearLayout (vertical) containing two sub-views: a main subview that's a ScrollView (it has lots of stuff in it - more than fits on the screen, so I'm using the ScrollView to deal with that) and a panel that appears when something in the configuration panel changes (with the usual things: a button to save and a button to revert). The problem is that I can't convince the ScrollView to shrink to allow the "save/revert" panel any space on the screen.
Here's an excerpt of the layout file: [EDIT: added contents of ScrollView]
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scrollbars="vertical">
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/scrollView">
<TextView
style="?android:listSeparatorTextViewStyle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tweeterLK_options"
android:layout_marginTop="15sp"
android:id="#+id/textView5"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/fgIntervalPrompt"
android:id="#+id/fgEnable"
android:checked="true"
android:paddingRight="5dp"/>
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/fgInterval"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<CheckBox android:id="#+id/bgEnable"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/bgIntervalPrompt"
android:checked="true"
/>
<Spinner android:id="#+id/bgInterval"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:prompt="#string/bgIntervalPrompt"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#string/tlkConfig_cacheDepth_prompt"
android:id="#+id/textView"
android:layout_gravity="center_vertical"
android:layout_marginRight="10dp"/>
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cacheDepth"
android:prompt="#string/tlkConfig_cacheDepth_prompt"
/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/tlkConfig_preload_avatar"
android:id="#+id/preload_avatar"
android:checked="true"
android:layout_weight="1"/>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/tlkConfig_preload_images"
android:id="#+id/preload_images"
android:checked="false"
android:layout_weight="1"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:visibility="visible">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/account"
style="?android:listSeparatorTextViewStyle"
android:layout_marginTop="15sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#string/signed_in_as"
android:id="#+id/signed_in_as"
android:visibility="visible"/>
<Button android:id="#+id/sign_in"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/sign_in"
android:visibility="gone"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/sign_out"
android:id="#+id/sign_out_button"
android:visibility="visible"/>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/lk_options_header"
style="?android:listSeparatorTextViewStyle"
android:layout_marginTop="14sp"
/>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lkServer_enableLK"
android:id="#+id/lkServer_enable"
android:checked="false"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/lkServer_selection">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#string/lkServer_serverListLabel"
android:id="#+id/lkServerLabel"
android:layout_gravity="center_vertical"
android:layout_marginRight="3dp"/>
<Spinner android:id="#+id/lkServerSpinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:prompt="#string/lkServerSpinnerPrompt"
android:longClickable="true"/>
</LinearLayout>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lkServer_inUse"
android:id="#+id/lkServer_useRecommendation"
android:checked="false"/>
</LinearLayout>
</ScrollView>
<LinearLayout android:id="#+id/settings_changed"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="0dip"
android:layout_weight="1"
android:visibility="gone">
<Button android:id="#+id/save"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:text="#string/save_settings"
/>
<Button android:id="#+id/revert"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:text="#string/reset_settings"
/>
</LinearLayout>
</LinearLayout>
When I make the #id/save layout visible (using setVisibility(View.VISIBLE)) it doesn't cause that ScrollView to resize. Any thoughts on why that is and what I should do about it?
I have 2 options: a) fix the size of the scrollview so that it always leaves room for the panel, or b) get rid of the panel and just pop up a dialog when the back button is pressed. I like the second one better mostly because I already have that working.
There is no content within the scrollview.Please add contents
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/scrollView">
//Place your layouts and contents here for things to get scroll
</ScrollView>
how do i align spinner to show equal in width in all screen? in my code spinner show different width in different screen what do i do? i have given fixed length
android:layout_marginRight="45dp"
android:layout_marginLeft="45dp"
in edittext and spinner but spinner show diffrent width in diffrent screen how do i fix this issue? i this is my image of screen http://imgur.com/RtWNgNI
and below is my full source code of screen.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#000000"
android:orientation="vertical"
android:weightSum="6" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="55dp"
android:layout_weight="0.5"
android:orientation="horizontal"
android:weightSum="1" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingBottom="10dp"
android:src="#drawable/agappbg" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:layout_weight="0.2"
android:orientation="horizontal"
android:weightSum="1" >
<EditText
android:id="#+id/txtMobileNo"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="45dp"
android:layout_marginRight="45dp"
android:layout_weight="1"
android:background="#ffffff"
android:gravity="left"
android:hint="#string/MobileNo"
android:singleLine="true" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.2"
android:orientation="horizontal"
android:weightSum="1" >
<EditText
android:id="#+id/txtPinNo"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="45dp"
android:layout_marginRight="45dp"
android:layout_weight="1"
android:background="#ffffff"
android:gravity="left"
android:hint="#string/PinNo"
android:inputType="textPassword"
android:singleLine="true" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.1"
android:orientation="horizontal"
android:weightSum="1" >
<Spinner
android:id="#+id/lgnspinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="-17dp"
android:layout_marginLeft="45dp"
android:layout_marginRight="45dp"
android:layout_marginTop="-15dp"
android:layout_weight="1"
android:paddingBottom="12dp"
android:paddingTop="12dp"
android:prompt="#string/network_prompt" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_weight="0"
android:orientation="horizontal"
android:weightSum="4" >
<Button
android:id="#+id/btnLogin"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="45dp"
android:layout_weight="1"
android:background="#drawable/curvedplanebutton_small"
android:text="Login"
android:textColor="#drawable/button_text_color" />
</LinearLayout>
It is not your fault, default background of Spinner has this kind of image (transparent padding around it). You can see yourself by setting android:background="#ffffff" on Spinner, doing this will remove padding from Spinner's sides and your problem will solve but you will loose Spinner arrow. I suggest you to create your own drawable for Spinner (because you are changing backgrounds of other View) otherwise default background is different for different OS versions and your implementation will seem broke.
Also you are using so many LinerLayouts for this simple layout. Consider this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#000000"
android:orientation="vertical"
android:weightSum="100" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center_horizontal"
android:layout_weight="30"
android:paddingBottom="10dp"
android:src="#drawable/ic_launcher" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="70"
android:orientation="vertical"
android:padding="16dp" >
<EditText
android:id="#+id/txtMobileNo"
style="?android:attr/buttonStyleSmall"
android:layout_width="fill_parent"
android:layout_height="40dp"
android:layout_marginBottom="4dp"
android:background="#ffffff"
android:gravity="center_vertical"
android:hint="MobileNo"
android:padding="4dp"
android:singleLine="true" />
<EditText
android:id="#+id/txtPinNo"
android:layout_width="fill_parent"
android:layout_height="40dp"
android:layout_marginBottom="4dp"
android:background="#ffffff"
android:gravity="center_vertical"
android:hint="Pin no"
android:inputType="textPassword"
android:padding="4dp"
android:singleLine="true" />
<Spinner
android:id="#+id/lgnspinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:background="#ffffff" />
<Button
android:id="#+id/btnLogin"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:text="Login" />
</LinearLayout>
</LinearLayout>
Adjust your references again, in case you copy paste my code.
Actually you did code right. It just seem like its not same size with EditText box because you used default background in spinner.
If you changed its background color or image like
android:background="#android:color/darker_gray"
And you can change its background image
android:background="#drawable/spinnerDropDownBackground"
And make sure image is 9 path So that it will not starched in big screen
How to create 9 patch for spinner ?
you will find that you did code right.
And if you want to use default background you have to change your code
android:layout_marginRight="40dp"
android:layout_marginLeft="40dp"
Hope this will help
I have a strange issue right now with a parent linear layout, I have its height set to fill_parent yet it seems intent on wrapping the content instead, what really is puzzling me even more is that in the graphical layout view its showing up the way Im intending for it to look but yet its still not doing what It should in the emulator?
here is my code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/title_color_dark_transparent" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical|center_horizontal|center"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="5dp"
android:orientation="vertical"
android:paddingTop="5dp" >
<EditText
android:id="#+id/menutweetedittext"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/edit_text"
android:gravity="top"
android:hint="#string/edittext_hint"
android:inputType="textCapSentences|textMultiLine|textAutoCorrect|textAutoComplete"
android:lines="4"
android:textAppearance="#style/TextAppearance.EditText" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:gravity="right"
android:orientation="horizontal" >
<TextView
android:id="#+id/menucharactersremaining"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/characters"
android:textColor="#FFFFFF"
android:textSize="20dp" />
<Button
android:id="#+id/menuposttweetbutton"
style="#style/TextAppearance.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="2dp"
android:background="#drawable/button_background"
android:onClick="posttweetbuttonClicked"
android:text="#string/postbuttonstext"
android:textSize="15dp" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="8dp"
android:orientation="vertical" >
</LinearLayout>
</LinearLayout>
<com.google.ads.AdView
android:id="#+id/menuadView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
ads:adSize="BANNER"
ads:adUnitId="a14f5be094d0328"
ads:loadAdOnCreate="true" />
</LinearLayout>
I took a shot at simplifying your layout. I ditched all your styling, but maybe the objects are in the right places. Is this what you're looking for?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/darker_gray" >
<EditText
android:id="#+id/menutweetedittext"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:gravity="top"
android:hint="Hint"
android:inputType="textCapSentences|textMultiLine|textAutoCorrect|textAutoComplete"
android:lines="4"
android:textAppearance="#android:style/TextAppearance.Medium" />
<Button
android:id="#+id/menuposttweetbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/menutweetedittext"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:onClick="posttweetbuttonClicked"
android:text="Tweet"
android:textSize="15dp" />
<TextView
android:id="#+id/menucharactersremaining"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/menuposttweetbutton"
android:layout_toLeftOf="#+id/menuposttweetbutton"
android:text="This is the text view"
android:textColor="#FFFFFF"
android:textSize="20dp" />
<ImageView
android:id="#+id/menuadView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="#android:color/white"
android:src="#drawable/icon" />
</RelativeLayout>
Here's my issue I have a login and want to line up the EditText fields. See the mockup picture attached .
I have tried a few ways and cannot figure out how to make the fields lineup.
I really hate layouts in Android I spend more time just messing with things to line up right. Wish they would just scrap it and use something more intuitive, as its more like using tables in HTML. So in advance thanks for your help and cheers!
You could probably play around with RelativeLayout and get just what you want.
Here's an approximation with TableLayout.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TableLayout
android:layout_marginTop="40dip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center">
<TableRow>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:padding="10dip"
android:text="UserID:" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dip"
android:text="USER ID" />
</TableRow>
<TableRow>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:padding="10dip"
android:text="Password:" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dip"
android:text="PASSWORD" />
</TableRow>
</TableLayout>
<LinearLayout
android:layout_marginTop="50dip"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="3"
android:gravity="center">
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="LOGIN" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="REGISTER" />
</LinearLayout>
</LinearLayout>
See if this works for you. It doesnt center quite perfectly but it does align well across multiple screen sizes.
<?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:background="#FFFF0000">
<LinearLayout android:id="#+id/top_row"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:orientation="vertical" android:layout_centerHorizontal="true" android:layout_width="wrap_content" android:layout_marginTop="25dip">
<LinearLayout android:layout_height="wrap_content" android:orientation="horizontal" android:layout_width="fill_parent">
<TextView android:layout_height="wrap_content" android:text="User Id" android:gravity="right" android:layout_marginRight="10dip" android:layout_width="fill_parent" android:layout_weight="2" android:textColor="#FF000000"></TextView>
<EditText android:layout_height="wrap_content" android:layout_width="fill_parent" android:ems="10" android:layout_weight="1"></EditText>
</LinearLayout>
<LinearLayout android:layout_height="wrap_content" android:orientation="horizontal" android:layout_width="fill_parent">
<TextView android:layout_height="wrap_content" android:text="Password" android:gravity="right" android:layout_marginRight="10dip" android:layout_width="fill_parent" android:layout_weight="2" android:textColor="#FF000000"></TextView>
<EditText android:layout_height="wrap_content" android:layout_width="fill_parent" android:ems="10" android:layout_weight="1"></EditText>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:orientation="horizontal" android:layout_width="wrap_content" android:layout_below="#+id/top_row" android:layout_centerHorizontal="true" android:layout_marginTop="20dip">
<Button android:layout_width="wrap_content" android:text="LOGIN" android:layout_height="wrap_content" android:layout_marginRight="10dip"></Button>
<Button android:text="REGISTER" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_marginLeft="10dip"></Button>
</LinearLayout>
</RelativeLayout>
Here's what it looks like in my IDE...
You can do this quick and dirty using TableLayout, just add a TableRow with a TextView and a EditText for the userid and repeat the same for the password.
See http://developer.android.com/resources/tutorials/views/hello-tablelayout.html