Menu design not uniform for all resolutions - android

i am trying to implemnt a app in i wrote code to draw APP Menu .In my application Menu is drawing at top_center of the layout for all resolution as shown in below images.
But i need Buttons at horizontal&vertical center of layout for all resolutions and screens.
Currently i am using below code.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/myLinear"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#2E9AFE"
android:orientation="vertical"
tools:context=".MainActivity" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Choose an Option"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white"
android:textSize="25dp"
android:textStyle="bold"
android:typeface="sans" />
"
<Button
android:id="#+id/bDefSms"
android:layout_width="256dp"
android:layout_height="64dp"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:background="#drawable/blackbutton"
android:drawableLeft="#drawable/sms"
android:paddingBottom="20dp"
android:text="AAA"
android:textColor="#android:color/white"
android:textSize="32dp"
android:textStyle="bold" />
<Button
android:id="#+id/bSMS"
android:layout_width="256dp"
android:layout_height="64dp"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:background="#drawable/blackbutton"
android:drawableLeft="#drawable/defsms"
android:text="BBB"
android:textColor="#android:color/white"
android:textSize="32dp"
android:textStyle="bold" />
<Button
android:id="#+id/bMMS"
android:layout_width="256dp"
android:layout_height="64dp"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:background="#drawable/blackbutton"
android:drawableLeft="#drawable/mms"
android:text="CCC"
android:textColor="#android:color/white"
android:textSize="32dp"
android:textStyle="bold" />
<Button
android:id="#+id/bMail"
android:layout_width="256dp"
android:layout_height="64dp"
android:layout_gravity="center"
android:background="#drawable/blackbutton"
android:drawableLeft="#drawable/email"
android:text="DDD"
android:textColor="#android:color/white"
android:textSize="32dp"
android:textStyle="bold" />
</LinearLayout>
Please help me.

just add one line to your linearlayout:
android:gravity="center"

wHey why don't you use RelativeLayout as a root like this and use attribute layout_centerHorizontal and layout_centerVertical to true:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/myLinear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#2E9AFE"
android:orientation="vertical"
tools:context=".MainActivity" >
</LinearLayout>
I hope this will help.

Related

how to keep center relativelayout inside DragLayer in android

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_gravity="top"
android:layout_weight=".1"
android:background="#color/colorPaleGrey2"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="20dp">
<TextView
android:id="#+id/meeting_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-medium"
android:gravity="center_horizontal"
android:text="Entrepreneur Meet Up"
android:textColor="#color/blackDark"
android:textSize="20.1sp"
android:textStyle="normal" />
<TextView
android:id="#+id/time"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/meeting_text"
android:layout_centerInParent="true"
android:layout_marginTop="10dip"
android:fontFamily="sans-serif-medium"
android:gravity="center_horizontal"
android:lineSpacingExtra="6sp"
android:text="(11:30AM - 4:00PM)"
android:textColor="#color/bluey_grey_three"
android:textSize="14sp"
android:textStyle="normal" />
</RelativeLayout>
<com.kdcos.contsync.utilities.dragview.DragLayer
android:id="#+id/framelayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/rl_dropView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="40dp">
<ImageView
android:id="#+id/imageView"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#drawable/ic_drop_cards" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView"
android:layout_centerInParent="true"
android:layout_gravity="center_horizontal|center"
android:fontFamily="sans-serif"
android:gravity="center_horizontal"
android:lineSpacingExtra="10sp"
android:text="Drop Cards Here"
android:textColor="#color/blackDark"
android:textSize="10sp"
android:textStyle="normal" />
</RelativeLayout>
</com.kdcos.contsync.utilities.dragview.DragLayer>
</LinearLayout>
this is my xml i want keep rl_dropView center inside com.kdcos.contsync.utilities.dragview.DragLayer i wrote xml like this i am unable to set it please look my screen please look i want to set dropView center but from my code its coming top left please suggest how to set it in center.
below is my current Screen:
if DragLayer is SubClass of RelativeLayout then it should work otherwise try below solution
Solution 1
<com.kdcos.contsync.utilities.dragview.DragLayer
android:id="#+id/framelayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/rl_dropView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="40dp">
<ImageView
android:id="#+id/imageView"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#drawable/ic_drop_cards" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView"
android:layout_centerInParent="true"
android:layout_gravity="center_horizontal|center"
android:fontFamily="sans-serif"
android:gravity="center_horizontal"
android:lineSpacingExtra="10sp"
android:text="Drop Cards Here"
android:textColor="#color/blackDark"
android:textSize="10sp"
android:textStyle="normal" />
</RelativeLayout>
</RelativeLayout>
</com.kdcos.contsync.utilities.dragview.DragLayer>
UPDATE
Solution 2
as I can see android:orientation="vertical" in your code under DragLayer.its mean DragLayer is SubClass of LinearLayout, so in your RelativeLayout just change
android:layout_centerInParent="true"
to:
android:layout_gravity="center_vertical"

relativelayout align issue about text and image overlap

I have the circle icon , it build up by one text view and one image view .
I want text and image can overlap , so i use relativeLayout.
When i run the app , i found it's align out of my control from different screen size.
Is there any better way to design the layout ?
I set the layout 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:orientation="vertical"
tools:context=".PageFragment.ActivityHomePage">
<LinearLayout
android:layout_width="300dp"
android:layout_height="wrap_content"
android:padding="15dp"
android:orientation="vertical">
<TextView
android:id="#+id/activityHpEduin"
android:textSize="15dp"
android:textColor="#66CDAA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="test" />
<TextView
android:id="#+id/activityHpTitle"
android:layout_marginTop="5dp"
android:textSize="20dp"
android:textColor="#android:color/black"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="test" />
<TextView
android:textSize="18dp"
android:layout_marginTop="5dp"
android:textColor="#6666ff"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="7.16.2016-2/12.2017"
android:id="#+id/activityHpDate" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:paddingTop="20dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/circleNews"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#drawable/btn_news" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="24dp"
android:layout_marginTop="70dp"
android:textColor="#android:color/white"
android:gravity="center"
android:text="#string/circleNews" />
<ImageView
android:id="#+id/circleActivityContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_toRightOf="#+id/circleNews"
android:src="#drawable/btn_content" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="140dp"
android:layout_marginTop="70dp"
android:gravity="center"
android:textColor="#android:color/white"
android:text="#string/circleActivityContent" />
<ImageView
android:id="#+id/circleSignUp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="5dp"
android:layout_toRightOf="#+id/circleActivityContent"
android:src="#drawable/btn_apply" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="252dp"
android:layout_marginTop="70dp"
android:gravity="center"
android:textColor="#android:color/white"
android:text="#string/circleSignUp" />
</RelativeLayout>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="20dp"
android:paddingLeft="15dp"
android:paddingRight="15dp">
<ImageView
android:id="#+id/circlePresenter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#drawable/btn_speakers" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:layout_marginTop="70dp"
android:gravity="center"
android:textColor="#android:color/white"
android:text="#string/circlePresenter" />
<ImageView
android:id="#+id/circleHotel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_toRightOf="#+id/circlePresenter"
android:src="#drawable/btn_accommodation" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="138dp"
android:layout_marginTop="70dp"
android:gravity="center"
android:textColor="#android:color/white"
android:text="#string/circleHotel" />
<ImageView
android:id="#+id/circleTransportation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="5dp"
android:layout_toRightOf="#+id/circleHotel"
android:src="#drawable/btn_traffic" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="252dp"
android:layout_marginTop="70dp"
android:gravity="center"
android:textColor="#android:color/white"
android:text="#string/circleTransportation" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="20dp"
android:paddingLeft="15dp"
android:paddingRight="15dp">
<ImageView
android:id="#+id/circleSponsor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="117dp"
android:src="#drawable/btn_sponsors" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="146dp"
android:layout_marginTop="70dp"
android:textColor="#android:color/white"
android:gravity="center"
android:text="#string/circleSponsor" />
</RelativeLayout>
</LinearLayout>
Try this sample code it is similar to what you want.
First here is the xml file code here i have a imageview and below it a text together they are in relative layout.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/RelativeLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView3"
android:layout_width="110dp"
android:layout_height="110dp"
android:layout_gravity="center"
android:layout_marginTop="40dp"
android:layout_weight="1"
android:src="#drawable/user_icon" />
<TextView
android:id="#+id/tv_email"
android:layout_width="200dp"
android:layout_height="45dp"
android:layout_alignStart="#+id/imageView3"
android:layout_below="#+id/imageView3"
android:layout_gravity="center_horizontal"
android:textColor="#color/White"
android:textSize="18sp" />
</RelativeLayout>
The output is like below:
another answer with new requirement:
xml code:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="119dp"
android:layout_marginTop="50dp">
<ImageView
android:id="#+id/imageView2"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:background="#drawable/banner_bg" />
<TextView
android:id="#+id/textView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fontFamily="#string/font_family_universal"
android:gravity="center"
android:padding="20dp"
android:text="hello world"
android:textAlignment="center"
android:textColor="#color/white"
android:textSize="25dp"
android:textStyle="normal"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
screenshot of above code:
Remember its a sample code change background path accordingly and other properties.Here there is image and above it there is textview as required.
try to bring your textview on front like this
tv_shimmer_tv_gooffline.bringToFront();
Use SDP. It help me more for such designing to support multiple screen sizes.
SDP - a scalable size unit.
An android SDK that provides a new size unit - sdp (scalable dp). This size unit scales with the screen size. It can help Android developers with supporting multiple screens.
for text views please refer to ssp which is based on the sp size unit for texts.
https://github.com/intuit/sdp

Layout is reversed?

Please view the image below:
The first image is the layout I did and it show normally on my device and another test devices. The second image is the layout showed on my friend device, it is reversed. I do not know why, and it just happened on few devices.
This is my layout code on xml.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:auto="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activities.ComposeSmsActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar_action" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="#dimen/padding_5">
<com.hnib.smslater.views.FlowLayout
android:id="#+id/layout_name_recipient"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_10"
android:fontFamily="sans-serif-light"
android:orientation="horizontal">
</com.hnib.smslater.views.FlowLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/padding_10">
<com.hnib.smslater.views.ClearableAutoContactCompleteTextView
android:id="#+id/et_recipient"
android:layout_width="#dimen/width_et_contact"
android:layout_height="#dimen/height_et_default"
android:layout_centerVertical="true"
android:layout_marginTop="#dimen/margin_10"
android:background="#drawable/drawable_radius_gray_gray"
android:fontFamily="sans-serif-light"
android:hint="#string/to_"
android:imeOptions="actionDone"
android:padding="#dimen/padding_5"
android:textColorHint="#color/gray"
android:textSize="18sp"
android:textStyle="bold"
auto:displayPhotoIfAvailable="false"
auto:styleOfTypedLetters="bold"
auto:typeOfData="phone"
auto:typedLettersHaveDifferentStyle="true" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/margin_5"
android:layout_marginTop="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:fontFamily="sans-serif-light"
android:text="#string/message"
android:textColor="#color/gray"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/tv_message_length"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:fontFamily="sans-serif-light"
android:text="160/1" />
</RelativeLayout>
<com.hnib.smslater.views.ActionEditText
android:id="#+id/et_text_content"
android:layout_width="match_parent"
android:layout_height="#dimen/height_et_big"
android:layout_marginLeft="#dimen/margin_5"
android:background="#drawable/drawable_radius_gray_gray"
android:ems="10"
android:fontFamily="sans-serif-light"
android:gravity="top"
android:inputType="textMultiLine"
android:maxLines="10"
android:padding="#dimen/padding_5"
android:scrollbars="vertical" />
<RelativeLayout
android:id="#+id/layout_time"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:padding="#dimen/padding_10"
android:showDividers="middle">
<TextView
android:id="#+id/tv_title_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="#drawable/drawable_radius_acent_gray"
android:fontFamily="sans-serif-light"
android:padding="#dimen/padding_5"
android:text="#string/time"
android:textAllCaps="true" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#+id/tv_title_time"
android:divider="?android:attr/dividerVertical"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="#dimen/padding_10"
android:showDividers="middle">
<TextView
android:id="#+id/tv_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/selector_textview"
android:fontFamily="sans-serif-light"
android:gravity="center_horizontal"
android:text="12/06/2016"
android:textColor="#color/gray"
android:textSize="27sp"
android:textStyle="bold" />
<TextView
android:id="#+id/tv_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/selector_textview"
android:fontFamily="sans-serif-light"
android:gravity="center_horizontal"
android:text="09:10"
android:textColor="#color/gray"
android:textSize="27sp"
android:textStyle="bold" />
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="#dimen/padding_10">
<TextView
android:id="#+id/tv_title_repeat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginRight="30dp"
android:background="#drawable/drawable_radius_acent_gray"
android:fontFamily="sans-serif-light"
android:padding="#dimen/padding_5"
android:text="#string/repeat"
android:textAllCaps="true" />
<Spinner
android:id="#+id/spinner_repeat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Spinner>
</LinearLayout>
<LinearLayout
android:id="#+id/layout_choose_sim"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="#dimen/padding_10">
<TextView
android:id="#+id/title_choose_sim"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="30dp"
android:background="#drawable/drawable_radius_acent_gray"
android:fontFamily="sans-serif-light"
android:padding="#dimen/padding_5"
android:text="#string/choose_sim"
android:textAllCaps="true" />
<Spinner
android:id="#+id/spinner_choose_sim"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Spinner>
</LinearLayout>
<LinearLayout
android:id="#+id/layout_confirm"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="#dimen/padding_10">
<TextView
android:id="#+id/tv_title_confirm"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginRight="15dp"
android:background="#drawable/drawable_radius_acent_gray"
android:fontFamily="sans-serif-light"
android:padding="#dimen/padding_5"
android:text="#string/ask_before_send"
android:textAllCaps="true" />
<CheckBox
android:id="#+id/checkbox_confirm"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="20dp"
android:layout_toRightOf="#+id/tv_title_confirm" />
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
Please have a help on this issue. Thanks.
The language on your friend's phone is probably different from yours, leading to the app giving a read from right to left, rather than your left to right. Does your friend have his phone's settings on language set to Hebrew or Arabic?
Edit: please take note of the answers below mine, those are the viable options for your friend's phone, besides for changing the language of course.
You should remove android:supportsRtl="true"
from the <application> element in your AndroidManifest.xml file.
You should ADD : android:supportRTL="false"
In the manifest

Overlapped Textview when text size increased + RelativeLayout

I have tried everything but not succeed yet.
What Happening. When title text is small it should come in center of parent which works perfectly, but when text size is big its overlapped to its left sided component
What i want : it shouldn't not overlap but comes to next of settings Textview. it should be adjust when size increased.
small size
big size
Code
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="#android:color/darker_gray" >
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Settings"
android:gravity="center_vertical"
android:layout_alignParentLeft="true"
android:textColor="#android:color/holo_orange_dark"
android:textSize="16.0sp" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
android:padding="4dp"
android:gravity="center"
android:layout_toLeftOf="#+id/txtBack"
android:textColor="#android:color/white"
android:textSize="19sp" />
</RelativeLayout>
Because you are using match_parent for those two TextViews, that is why they will being overlapped, based on your code, you can try to add a fix padding for the second TextView. For example, we consider the width of the first TextView's text "Settings" is 100dp, so we can change the code as below.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="#android:color/darker_gray" >
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Settings"
android:gravity="center_vertical"
android:layout_alignParentLeft="true"
android:textColor="#android:color/holo_orange_dark"
android:textSize="16.0sp" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
android:paddingTop="4dp"
android:paddingBottom="4dp"
android:paddingLeft="100dp"
android:paddingRight="100dp"
android:gravity="center"
android:layout_toLeftOf="#+id/txtBack"
android:textColor="#android:color/white"
android:textSize="19sp" />
</RelativeLayout>
set id to your first TextView and then make second TextView toRightOf first one.
Like This
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="#android:color/darker_gray" >
<TextView
android:id="#+id/textview1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Settings"
android:gravity="center_vertical"
android:layout_alignParentLeft="true"
android:textColor="#android:color/holo_orange_dark"
android:textSize="16.0sp" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#id/textview1"
android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
android:padding="4dp"
android:gravity="center"
android:layout_toLeftOf="#+id/txtBack"
android:textColor="#android:color/white"
android:textSize="19sp" />
</RelativeLayout>
I hope this will help.
Try this,
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="#android:color/darker_gray" >
<TextView
android:id="#+id/txtSetting"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Settings"
android:gravity="center_vertical"
android:layout_alignParentLeft="true"
android:textColor="#android:color/holo_orange_dark"
android:textSize="16.0sp" />
<TextView
android:layout_toRightOf="#+id/txtSetting"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
android:padding="4dp"
android:gravity="center"
android:layout_toLeftOf="#+id/txtBack"
android:textColor="#android:color/white"
android:textSize="19sp" />
</RelativeLayout>
Use layout_toLeftOf ,alignParentLeft and alignParentRight
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Settings"
android:id="#+id/txtBack"
android:gravity="center_vertical"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#+id/selectaccount"
android:textColor="#android:color/holo_orange_dark"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
android:padding="4dp"
android:gravity="center"
android:layout_alignParentRight="true"
android:textColor="#android:color/white"
android:textAppearance="?android:attr/textAppearanceMedium" />
Just Replace Your Code By Below:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="#android:color/darker_gray" >
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Settings"
android:gravity="center_vertical"
android:layout_alignParentLeft="true"
android:textColor="#android:color/holo_orange_dark"
android:textSize="16.0sp"
android:id="#+id/txtSettings" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
android:padding="4dp"
android:gravity="center"
android:layout_toRightOf="#+id/txtSettings"
android:layout_toLeftOf="#+id/txtBack"
android:textColor="#android:color/white"
android:textSize="19sp" />
</RelativeLayout>
change second textview to this:
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
android:padding="4dp"
android:gravity="center"
android:layout_toRightOf="#+id/firstTextview"
android:textColor="#android:color/white"
android:textSize="19sp" />

GridLayout - Aligning Element

I am trying to reduce the space between 2 columns, have tried using negative margins, but did not work. Is there a way to bring the 2 elements in the image closer ?
<?xml version="1.0" encoding="utf-8"?>
<GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:useDefaultMargins="true"
android:alignmentMode="alignBounds"
android:columnOrderPreserved="false"
android:layout_gravity="center"
android:orientation="horizontal"
android:stretchMode="columnWidth"
android:background="#color/orange"
android:textSize="12sp"
android:columnCount="8">
<ImageButton
android:id="#+id/settings"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnSpan="1"
android:layout_gravity="left"
android:src="#drawable/settings" />
<TextView
android:id="#+id/currentCityName"
android:layout_column="2"
android:textSize="22sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="City name"
android:layout_columnSpan="4"
android:layout_gravity="center_horizontal"
/>
<ImageButton
android:id="#+id/refresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="7"
android:layout_columnSpan="1"
android:layout_gravity="right"
android:src="#drawable/reload" />
<ImageView
android:id="#+id/currentWeatherImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnSpan="8"
android:layout_rowSpan="3"
android:layout_gravity="center_horizontal"
android:src="#drawable/cloud" />
<ImageView
android:id="#+id/humidityIcon"
android:layout_width="20dp"
android:paddingTop="10dp"
android:paddingLeft="0dp"
android:paddingRight="0dp"
android:layout_marginRight="0dp"
android:layout_gravity="left"
android:background="#000000"
android:src="#drawable/humidity" />
<TextView
android:id="#+id/humidity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="13sp"
android:paddingTop="10dp"
android:paddingLeft="0dp"
android:layout_marginLeft="0dp"
android:layout_gravity="left"
android:background="#FFFFFF"
/>
<TextView
android:id="#+id/temperature"
android:layout_columnSpan="4"
android:layout_rowSpan="2"
android:textSize="49sp"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:layout_gravity="center_horizontal"/>
<ImageView
android:id="#+id/windSpeedIcon"
android:layout_width="30dp"
android:layout_marginRight="1dp"
android:paddingRight="1dp"
android:layout_gravity="right"
android:src="#drawable/wind" />
<TextView
android:id="#+id/windSpeed"
android:textSize="12sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
/>
<!-- android:layout_width="40dp" -->
<TextView
android:id="#+id/precipitationIcon"
android:textSize="28sp"
android:layout_width="40dp"
/>
<TextView
android:id="#+id/precipitation"
android:layout_column="0"
android:textSize="13sp"
android:layout_width="40dp"
/>
<TextView
android:id="#+id/windDirection16Point"
android:textSize="13sp"
android:layout_width="80dp"
android:layout_columnSpan="2"
/>
<TextView
android:id="#+id/weatherDescription"
android:layout_gravity="center_horizontal"
android:layout_row="7"
android:layout_columnSpan="8"/>
<TextView
android:id="#+id/section_label"
android:layout_margin="5dp"
android:layout_columnSpan="8" />
<EditText
android:minLines="4"
android:maxLines="4"
android:id="#+id/edit"
android:layout_columnSpan="8"/>
I suggest implementing the entire view using a RelativeLayout, should be the best solution for the entire view.
You are tackling the wrong problem – you are asking how to reduce the space between columns in a grid layout, but maybe you should’t have used such a layout in the first place!
What you should have been using for your specific layout, is a combination of relative positioning and compound drawables (here, with android:drawableStart).
<?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="80dp"
android:background="#d89018"
android:paddingBottom="4dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:paddingTop="4dp"
>
<TextView
android:id="#+id/temperature"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:text="25 ℃"
android:textColor="#fff"
android:textSize="49sp"
/>
<TextView
android:id="#+id/humidity"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:drawableStart="#drawable/humidity"
android:gravity="center_vertical"
android:text="83 %"
android:textColor="#fff"
/>
<TextView
android:id="#+id/windSpeed"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentEnd="true"
android:drawableStart="#drawable/wind"
android:gravity="center_vertical"
android:text="19 km/h"
android:textColor="#fff"
/>
<TextView
android:id="#+id/precipitation"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:drawableStart="#drawable/precipitation"
android:gravity="center_vertical"
android:text="0.1 mm"
android:textColor="#fff"
/>
<TextView
android:id="#+id/windDirection16Point"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignLeft="#id/windSpeed"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:drawableStart="#drawable/windDirection"
android:gravity="center_vertical"
android:text="NNW"
android:textColor="#fff"
/>
</RelativeLayout>
Not only this layout is simpler, you also let Android take care of all the spacing for you. To change the spacing between the compound drawable and the text, use android:drawablePadding in the layout’s code above; in Java code, that would be TextView.setCompoundDrawablePadding).
Icons used for the sample: water, windsock, rainy-weather and wind-rose.
I think what's happening is that your Views are being stretched because they are trying to match the width of another view in their columns.
Try decreasing the columnSpan of your Views or separate your layout into two separate GridLayouts.
Or, consider using a different layout altogether. I would recommend RelativeLayout here instead of GridLayout, but I don't know how this fits into a larger window.
try 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="100dp">
<LinearLayout
android:id="#+id/col1"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_weight="2.4"
>
<LinearLayout
android:id="#+id/col1_row1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="83%"/>
</LinearLayout>
<LinearLayout
android:id="#+id/col1_row2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1.0mm"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/col2"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_weight="2.0"
android:gravity="center"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="25'"
android:textSize="50dp"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/col3"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_weight="2.4"
>
<LinearLayout
android:id="#+id/col3_row1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="19Km"/>
</LinearLayout>
<LinearLayout
android:id="#+id/col3_row2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="NNW"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
I think you should change usedefaultMargins to false and give your own margins to the elements.
android:useDefaultMargins="false";

Categories

Resources