Center text in EditText not working programmatically when adding background resource - android

I am working on an app that inserts an EditText box programmatically onto the layout. I cannot seem to get the center text working when I add the EditText programmatically but it works fine when I do it through the XML layout. I have nailed down the problem to be when I add the background resource. I have added code below to show both EditText when added through code and also XML.
<LinearLayout
android:id="#+id/layoutLinear_main"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#drawable/background" >
<LinearLayout
android:id="#+id/layoutLinear_answerDisplay"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:orientation="vertical" >
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:gravity="center"
android:background="#drawable/background_field"
android:layout_gravity="center"
android:layout_marginLeft="120dp"
android:layout_marginRight="120dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:textSize="30dp"
android:hint="F"
android:text="F" />
</LinearLayout></LinearLayout>
Then within the main code. I add an EditText programmatically. I've removed the margins and paddings, just to clearly identify the issue.
LinearLayout layoutLinear_answerDisplay = ((LinearLayout) this.findViewById(R.id.layoutLinear_answerDisplay));
EditText ed = new EditText(this);
ed.setGravity(Gravity.CENTER);
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
layoutParams.gravity = Gravity.CENTER;
ed.setLayoutParams(layoutParams);
ed.setBackgroundResource(R.drawable.background_field);
ed.setTextSize(30);
ed.setHint("F");
ed.setText("F");
layoutLinear_answerDisplay.addView(ed);
The following is then the ouptut. You can see from the image that the top EditText has centered text (this was done through the XML code). You can see from the bottom EditText, that the text is off centered (done through the code behind).
I have also attached my background resource for the EditText. Any help would be greatly appreciated. Thanks

It looks like you're using the layout_margin (Left & Right) to center the xml edittext. when you set those in code you're not taking into account the dp scaling.
final int width = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,
(float) 120.0, getResources().getDisplayMetrics());
use something like the above to scale your 120 measure to the correct pixel equivalent and then they will be in the same place. But realize also that you shouldn't need to use such high values for the left/right margins to get your text centered

Related

Android Textview with width 0 is forcing content to disappear below it

I have a TextView whose width should not exceed the ImageView above it. Both image and text are downloaded from server and I don't know their dimensions (can't make assumptions either). I went through the logic to wrap the text content using this SO post.
Here is my layout XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/parentLL"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout android:orientation="vertical"
android:id="#+id/LL1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:width="0dp"
android:text="This is a string whose width may or may not be more than the image downloaded" />
</LinearLayout>
<TextView android:background="#android:color/holo_red_dark"
android:id="#+id/text2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Second Text"/>
</LinearLayout>
With this code, the TextView at the end (text2) does not even show up. There are 2 solutions to this issue :
Apply android:maxLines="5" to the text1. Problem with this approach is that Text1 view would always be 5 lines high (I understand 'lines' is not a unit of height, but that's what I see visually). So if the text content is just one word, there would be a big white space below. And then text2 shows up.
Change topmost linear layout (parentLL) to RelativeLayout. text2 can then be used with alignBelow=LL1. This works as expected. But I cannot migrate the topmost view to RelativeLayout, because this view is from a library not in my control. I can only modify LL1 and it's children. Due to my code, other views below (like text2) are suffering (by not showing up).
There is a third approach for setting the textview as a compound drawable on ImageView. I guess that might work (haven't tested), but my requirement is to show the TextView if image download has failed (which can be detected only after a while). So I need to have a TextView. Also, my LinearLayout LL1 can have other children too.
I would request for some help understanding :
Why is my code not showing up the content below the textview 'text1'? With width=0 on textview it seems to set the height of the parent to be match_parent.
How is RelativeLayout able to handle this smoothly ? Can I replicate any of that behavior in TextView's onMeasure ? Assume I have callbacks to detect image has been downloaded, and I can get image width also.
I think what you are running into is a conflict of setting the width and height but not setting the layout weight, which is a key factor in how Linear Layouts work. If you add one more vertical LinearLayout in there and then move #id/text2 into it, you should be set. You'll need something like the following (obviously modified to your specs, this was just a quick test). Note my use of android:layout_weight,
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Large Text"
android:id="#+id/textView3" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Large Text"
android:id="#+id/textView2" />
</LinearLayout>
</LinearLayout>
Which splits the screen in half vertically as shown in this picture,
Photo of resulting layout
I had to wrap the TextView in a RelativeLayout, which was wrapped by a LinearLayout. Not happy with this solution, but this is the only way for now.

Android getting Button not going in center of screen

I have a button that I am trying to make in the center of the screen:
<?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:background="#color/black"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="0dp"
android:paddingRight="0dp"
android:paddingTop="0dp"
android:paddingBottom="0dp"
tools:context="com.vroy.trapper.MainMenuActivity">
<Button
android:id="#+id/playBtn"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="#string/play_button_text"
android:background="#drawable/round_button"
/>
</RelativeLayout>
(I set the width/height to 0dp because I programmatically change them.)
The problem is while while in the XML design tab the button appears to be in the center of the screen (if I set the width/height to 50dp for testing) when I actually run the program the button appears in the top left of the screen.
How do I make sure the button is actually in the center of the screen?
Here is the code where I set the width/height of the button:
int screenWidth = getResources().getDisplayMetrics().widthPixels;
// int screenHeight = getResources().getDisplayMetrics().heightPixels;
Button playBtn = (Button) findViewById(R.id.playBtn);
int playBtnWidth = screenWidth/3;
playBtn.setLayoutParams(new LayoutParams(playBtnWidth, playBtnWidth));
By setting the LayoutParams programmatically you are resetting all the information within those parameters to the default (with the exception of the height and width, since you set those in the constructor). Try creating the LayoutParams as a variable, then set the layout location.
LayoutParams params = new LayoutParams(playBtnWidth, playBtnWidth);
params.addRule(RelativeLayout.CENTER_IN_PARENT, RelativeLayout.TRUE);
playBtn.setLayoutParams(params);
Link to RelativeLayout

Why my TextView under an ImageView is not showing

I am writing an Android game. In the level selection activity's layout file, I want to layout the levels' buttons (They are actually ImageViews) like this:
x x x
x x x
And each level button has a TextView, with that level's name as the text, below it (Let's call these two views together as a "level choice"). I used a lot of LinearLayouts to do this. Here is the code for a level choice:
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/angles"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/angles_level"
android:textSize="#dimen/level_text_size"/>
</LinearLayout>
As you can see, the two views' height and width are all wrap_content. But when I look at the designer, the text view doesn't show up.When I select the text view in the component tree, it shows where the text view is:
P.S. The picture isn't showing all six levels because I haven't made them yet.
As you can see, the text view is right at the bottom! When I select the ImageView, it shows that it is occupying all the space of its parent!
I don't know why this is happening, my image is certainly a square! Can you explain why this is happening and how do I fix it?
If you need my whole layout code, feel free to tell me in the comments.
For me, the best solution is to position and size it properly by code (where you have total control) instead of xml.
Anyway, i think your problem can be solved by setting ImageViews ScaleType
imageView1.setScaleType(ScaleType.FIT_START);
By XML:
android:scaleType="fit_start"
Hope this helps.
I use background color for textview when I'm studying the layout.
If you use wrap content in both dimension for TextView, that is invisible since you did not write any text inside it. wrap content means that the view take the minimum space. And no text means 0px; try to set ImageView and TextView with layout_weight 1 and layout_height 0dp. In this way both view take half of space of parent layout
Because right now, your LinearLayout doesn't know how to distribute the ratio of its children. And in fact, your imageview's wrap content already
consumes the whole space.
So, LinearLayout says "Sorry TextView, you have no space left".
Use layout_weight to both of the children.
I guess you want to have your picture twice the size of your text.
2:1
That is,
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=2
android:src="#drawable/angles"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=1
android:text="#string/angles_level"
android:textSize="#dimen/level_text_size"/>
</LinearLayout>
I just realized that I posted a question about ImageViews leaving out too much whitespace:
LinearLayout leaving out too much white space. Why?
I think this is the same as that problem. So I tried setting adjustViewBounds to true in the xml. And it works! Now the image view look like this:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/parallel_lines"/>
You can use relative layout
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/angles"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/angles_level"
android:textSize="#dimen/level_text_size"/>
</RelativeLayout>
or simple you can set background of textview to that image by putting this
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/angles_level"
android:background="#drawable/angles"
android:textSize="#dimen/level_text_size"/>

Android Text view height changes in dynamic

I'm having problem setting a TextView height dynamically. My xml file is
<TextView
android:id="#+id/rateUpdateTime"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:paddingBottom="0dp"
android:text="#string/update_time"
android:textColor="#000000"
android:textStyle="bold"
android:textSize="13sp"
android:layout_weight=".48"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:background="#5FB6CB"
/>
In this TextView I'm setting different messages based on the action happening in my activity. So I need to set height as wrap_content dynamically. Also I'm using different controllers in LinearLayout. This TextView belongs within this single LinearLayout. Please any one help me to set TextView Height = LinearLayout dynamically.
Setting the values of Layout params in the .java code may solve this. Refer this for documentation.

Android: how to layout the button so the text looks like the one in screenshot?

Please have a look at the screenshot above, the string for the text is "DELETE SELECTED\nMESSAGES" if I use wrap_content for width/height of its parent linearlayout, the text would look like:
DELETE
SELECTED
MESSAGES
(without line space between each word)
if I use match-parent for the button's width, it will be stretched to match its parent, which is not what I want. Can anyone help me with this?
Thanks!
EDIT:
the layout of the button:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:layout_margin="5dip"
android:paddingTop="5dip"
android:paddingBottom="0dip"
android:background="#drawable/solid_grey_btm_rounded">
<Button
android:text="#string/delete_selected_messages"
android:id="#+id/btn_delete_message"
android:gravity="center"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/button_grey_selector">
</Button>
</LinearLayout>
I am working on Android 2.3.3 API Level 10, I was testing on a Motorola Milestone(the one with real keyboard)
Try to use android:minLines="2", this should help.
I solved it my setting the button's layout_width and layout_height to "match_parent" or "fill_parent", also, added margin to make the button not fullfil its parent, added padding to make the text narrower.

Categories

Resources