I want to put the getlocation / compass button inside my editfield, I am not quite sure how I can do this or where to start, please can someone guide me. What I have to do is, something like the two screenshots below;
I have tried playing around with the layout but I can't seem to figure out how I can do this, I have the basic layout done;
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:background="?attr/colorPrimary"
android:orientation="vertical" >
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="100dp">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPostalAddress"
android:ems="10"
android:hint="Your Post Code"
android:id="#+id/editText"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Proceed"
android:background="#fff"
android:id="#+id/button"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp" />
</LinearLayout>
</LinearLayout>
You can use android:drawableRight attribute in xml:
https://developer.android.com/reference/android/widget/TextView.html#attr_android:drawableRight
Something like that:
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPostalAddress"
android:ems="10"
android:hint="Your Post Code"
android:id="#+id/editText"
android:drawableRight="#drawable/YOUR_COMPASS_DRAWABLE"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"/>
where YOUR_COMPASS_DRAWABLE is a compass picture in res/drawable/ folder (you must used different pictures for different screen: mdpi, hdpi, etc.)
Related
I am new to android programming but I know how everything works, recently I was trying to create an app just like uber after I finished creating the launch activity i tested it on my actual device just to check whether everything looks fine but when I launched it on my device everything (layouts, imageViews, Textviews..etc) were misplaced, I have never had this problem before its just this time. could anyone please tell me where am I going wrong?
I am attaching screenshots below.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
tools:context="com.example.keyur.uber.MainActivity">
<LinearLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/layout1"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/showtext"
android:layout_width="300dp"
android:layout_height="50dp"
android:layout_marginLeft="30dp"
android:layout_marginTop="20dp"
android:background="#ffffff"
android:fontFamily="monospace"
android:text="#string/get_moving_with_uber"
android:textColor="#000000"
android:textSize="20sp"
android:typeface="monospace" />
<ImageView
android:layout_width="40dp"
android:id="#+id/imgv"
android:layout_height="30dp"
android:layout_below="#id/showtext"
android:layout_marginLeft="30dp"
android:background="#drawable/india"
/>
<TextView
android:layout_width="40dp"
android:id="#+id/countrycode"
android:layout_height="30dp"
android:layout_centerVertical="true"
android:layout_marginStart="13dp"
android:layout_toEndOf="#+id/imgv"
android:text="#string/_91"
android:textColor="#000000"
android:textSize="22sp"
android:fontFamily="monospace"
/>
<EditText
android:id="#+id/editText"
android:layout_width="250dp"
android:layout_height="40dp"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:background="#ffffff"
android:fontFamily="monospace"
android:hint="#string/enter_your_mobile_number"
android:textColor="#000000"
android:textColorHint="#484848"
android:textSize="17sp"
android:inputType="number"
/>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="400dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imgone"
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="#drawable/layoutbg" />
</RelativeLayout>
</LinearLayout>
screenshots-
this is what the app looks on pixel 4 as it is set on default.
enter image description here
this is what it looks when I switch it to pixel xl, everything gets messed up
enter image description here
Due do you are fixing the layout hight an width so each and very device have different screen size. You should use match_parent and wrap_content. If you want to split all device space in the same manner, you have to use weight.
How to use weight reference
Either you can go for "Weight Sum", or you should set your
TextView for country-code "layout_toRightOf" to image view
instead of "layout_toEndOf".
i got a very weird type of problem while developing a basic android app.
While I've created an app in which the background image of an app is visible to all the devices except nexus devices of android marshmallow. Kindly help me in solving the error.
Below is the code and screenshot attached.
<?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:background="#drawable/abst"
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="project.scytech.mi_agenda.LoginActivity">
<include
android:id="#+id/linearLayout"
layout="#layout/appname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/loginLayout"
android:layout_centerHorizontal="true"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/loginLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical"
android:paddingTop="16dp">
<EditText
android:id="#+id/editTextDomainName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:hint="#string/domainName"
android:inputType="textUri"
android:textColorHint="#FFF8E5" />
<EditText
android:id="#+id/editTextUsername"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:hint="#string/username"
android:textColorHint="#FFF8E5" />
<EditText
android:id="#+id/editTextPassword"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:fontFamily="#string/username"
android:hint="#string/password"
android:inputType="textPassword"
android:textColorHint="#FFF8E5" />
<Button
android:id="#+id/buttonLogin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:layout_marginTop="16dp"
android:clickable="true"
android:onClick="loginClicked"
android:text="#string/login" />
</LinearLayout>
</RelativeLayout>
Please try to use an ImageView and set it as background.
It means:
Use a RelativeLayout or a FrameLayout and define your ImageView as the
first child. The first objects defined are the lowest in the z-order
(i.e. they will be "below" the other views).
From: Setting an ImageView to the background Android
To fit it to whole screen device use match_parent or android:scaleType="fitXY"
Your code should look like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#000000" >
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="42dp"
tools:ignore="ContentDescription" />
//Rest of widgets......
Check also: How to make image fill RelativeLayout background without stretching
It should work
this may sound trivial but I am currently having difficulty in the display of the LikeButton. It does not look as intended.
It is supposed to look like this.
https://s3.amazonaws.com/uploads.hipchat.com/20645/978150/Pm1GbfbVvhpmjVU/Screen%20Shot%202014-10-24%20at%2010.25.15%20AM.png
Instead it looks like the following:
https://s3.amazonaws.com/uploads.hipchat.com/20645/978150/JEuU1CEq3Dvmzjj/Screen%20Shot%202014-10-24%20at%2010.27.56%20AM.png
Notice the extra long blue space being stretched and "Like" text being extremely small in the second pic.
Here is the code for the layout file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layoutFacebookLike"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:screenOrientation="sensorLandscape" >
<TextView
android:id="#+id/textFacebookIncentiveText"
style="#style/Huge"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:padding="48dp"
android:text="#string/txt_facebook_incentive_default"
android:textColor="#android:color/white" />
<RelativeLayout
android:id="#+id/layoutFacebookLikeContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#40000000"
android:layout_gravity="center"
android:gravity="center_horizontal">
<Button
android:id="#+id/btnContinue"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="32dp"
android:paddingBottom="16dp"
android:paddingLeft="2dp"
android:paddingRight="2dp"
android:paddingTop="16dp"
android:text="#string/btn_continue"
android:layout_alignParentLeft="false"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white"
android:layout_centerInParent="true" />
<com.facebook.widget.LikeView
android:id="#+id/likeView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_margin="64dp"
android:layout_centerInParent="true"
android:textAlignment="gravity"
android:layout_alignParentBottom="false"
android:layout_alignParentLeft="false" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
The code in the activity that I am using is as follows:
LikeView mLikeButton = (LikeView) findViewById(R.id.likeView1);
mLikeButton.setObjectId("121083561691");
mLikeButton.setLikeViewStyle(LikeView.Style.STANDARD);
mLikeButton.setAuxiliaryViewPosition(LikeView.AuxiliaryViewPosition.INLINE);
mLikeButton.setHorizontalAlignment(LikeView.HorizontalAlignment.CENTER);
mLikeButton.setForegroundColor(Color.WHITE);
Please let me know how I can correct it.
This issue arises when you have some themes and styling already set for the activity which interferes with the design of the LikeButton. If you set the default values, the Like Button appears normal.
I am trying to get the following look (screenshot from my iOS app) on the Android version of my app.
I have defined my layout file as follows in Android:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_root"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<EditText
android:id="#+id/postTextTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/shareLILayout"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:ems="10"
android:gravity="top|left|start"
android:inputType="textMultiLine" >
<requestFocus />
</EditText>
<LinearLayout
android:id="#+id/shareLILayout"
android:layout_alignParentBottom="true"
android:background="#999999"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:orientation="horizontal" >
<ImageButton
android:contentDescription="#string/li_btn_desc"
android:id="#+id/postToLIButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="#android:color/transparent"
android:src="#drawable/linkedin_switch_off" />
<TextView
android:id="#+id/postToLITextView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="#string/share_on_linkedin"
android:layout_gravity="center_vertical"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="14sp" />
</LinearLayout>
</RelativeLayout>
If I swap my ImageButton and TextView above, my app just crashed with a RuntimeException! Also I am not able to center the text so that its aligned to the center of the button. What am I doing wrong?
Simply swap the ImageButton and TextView order. Your runtime error is either unrelated or is caused by the need to clean your project before you need to redeploy it (sometimes resource IDs get funky). Also use android:gravity="center_vertical" for you TextView to center it properly
I am trying to achieve the following layout on my Android app:
As you can see I want a central login box taking about 70% of the width. I believe there are basically two approaches to achieve this:
1. Create a Linear or Relative layout for the login box, and add layoutMargin both on the left and right sides.
2. Create a wrapper LinearLayout with weightSum="1", and then place the RelativeLayout inside it with layout_width="0dp" and layout_weight="0.7".
Using the first approach the XML would look 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">
<ImageView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/logo"
android:contentDescription="#string/logo"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#999999"
android:gravity="center"
android:layout_margin="30dp"
>
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:hint="#string/email" />
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:hint="#string/password" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login"/>
</LinearLayout>
</LinearLayout>
The second approach would just have a wrapper LinearLayout on top of the current one, with weightSum="1", and the internal layout would get a layout_weight="0.7" attribute.
Which one do you think is the best approach? Thanks in advance.
A rather simple way would be use a linear layout inside a relative layout. Then use layout_centerInParent and set it to "true". Once that is done you can set your margin to what ever you would like (I used 30 dp). Here is an example:
<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" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_margin="30dp"
android:orientation="vertical"
android:weightSum="50" >
<EditText
android:id="#+id/editText1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:inputType="textEmailAddress" >
<requestFocus />
</EditText>
<EditText
android:id="#+id/editText2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/editText1"
android:layout_centerHorizontal="true"
android:inputType="numberPassword" />
<Button
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/editText2"
android:layout_centerHorizontal="true"
android:text="Button" />
</LinearLayout>
</RelativeLayout>
Of course, if you wanted the width of the log in box to be exactly 70 percent of the width of the screen, you could do it programmatically.
There's a 3d alternative, create the login box in a LinearLayout/RelativeLayout, and then align it center horizontally.