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
Related
I use ScrollView with multiple Views but I have an ImageView on the top. What I need is auto fitting image height as screen height as.
My current layout starts like this :
<LinearLayout
android:orientation="vertical"
android:id="#+id/layout_dashboard"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/toolbar_dashboard_layout" />
<ScrollView
android:scrollbars="none"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
Thanks.
To make sure ImageView adjusts its height, use attribute adjustViewBounds for example:
<ImageView android:id="..."
android:adjustViewBounds="true" ... />
Your screen dimensions cannot be known in a resource file, as the Android system takes these files and then renders them to the given device screen.
So, to make any View proportional to the screen size, we need to set its parameters programmatically. Luckily, Android gives us Display, which holds data about our display. Use this object to retrieve the height of the display, then set the height of our View to that:
ImageView imageView = (ImageView) findViewById(R.id.image_view);
Display display = getWindowManager().getDefaultDisplay();
//We need to store the dimensions in a Point object.
Point point = new Point();
display.getSize(point);
//Now, set the width and height.
profileImage.getLayoutParams().width = point.x;
profileImage.getLayoutParams().height = point.y;
I started yesterday with developing for Android. I already know Java, so you don't have to explain general Java things for a beginner.
Information:
IDE: Android Studio (latest)
Minimum API: 10
I want to code a fun app where the user types a countdown in a C4 Bomb UI and the bomb's ticking after the input.
I have now the problem that I can not position the elements margin in % of the screen.
Here's an image with the text field, buttons and the margins I calculated with the image dimensions.
How can I do this?
You could use the following algorithm:
//declare two variables for width and height of the screen, that you could use later
private int screenWidth;
private int screenHeight;
//first get the size of the screen - call this method in the onCreate method of your Activity
private static void getScreenResolution(Context context){
WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
Display display = wm.getDefaultDisplay();
DisplayMetrics metrics = new DisplayMetrics();
display.getMetrics(metrics);
screenWidth = metrics.widthPixels;
screenHeight = metrics.heightPixels;
}
//then use dynamically positioning of the elements as you use LayoutParameters for your elements like this:
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT); //width, height
params.setMargins(11*screenWidth/100, 34*screenHeight/100, 0, 0);//left, top, right, bottom - here you could use the % like 11% from screenWidth = 11*screenWidth/100 (all the digits are for example)
//get the element which you want to be positioned at the current position (for example an ImageView)
ImageView myImage = (ImageView)findViewById(R.id.myImage);
myImage.setLayoutParams(params);
P.S. If your layout is RelativeLayout, you should use RelativeLayout.LayoutParams instead of Linearlayout.LayoutParams (just change the word)
You could use weighted layout(empty layout on left and right side of your image then wrap it again for vertical). Let say I want to create an image with margin 25% on both side, then the weight for each empty layout is 1, and for the image is 2.
UPDATE:
here's a little example, the "view" component is just a placeholder for margin
The top and bottom margin is 25% of height, while the left and right margin is 20% of screen's width.
<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" >
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2">
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<ImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3" />
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
I am writing an application where need to assign rest of screen space to view.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/txtView_1"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:id="#+id/txtView_2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Test Text" />
</LinearLayout>
and to set runtime I am using following:
private void process() {
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
int txtView1Height = txtView_1.getHeight();
LayoutParams layoutParams = (LayoutParams) txtView_2.getLayoutParams();
layoutParams = new LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT,
(metrics.heightPixels - txtView1Height));
txtView_2.setLayoutParams(layoutParams);
}
But here it's taking not exact same remaining height..since textview sting not placing in center(this is how I simply check)...it might be mistaken to set height in pixel.
Any suggestion here?
You can use weight xml parameter
<TextView
android:id="#+id/txtView_2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.0"
android:gravity="center"
android:text="Test Text" />
or in your case simple set height to match_parent
android:layout_height=match_parent
To check even more simpler set gravity to bottom. If you still want to do this programmatically dont use DisplayMetrics to get height (Action Bar and Software Buttons are also a part of display) use your root LinearLayout height. Also check if txtView1Height is not 0 (maybe view was not drawed at the moment of calculation)
I want to have 2 layouts inside ScrollView. First layout should be on the full screen and second layout below first one. When activity starts it is not possible see second layout. Second layout is possible see after scroll screen. Please take a look on my image for better understand.
Layout code: `
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="15dp" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="200dp"
android:orientation="vertical" >
<!-- this layout can be any height you want -->
</LinearLayout>
</LinearLayout>
</ScrollView>`
Get the device screen height:
Point size = new Point();
getWindowManager().getDefaultDisplay().getSize(size);
int screenHeight = size.y;
Find the LinearLayout:
LinearLayout layout = (LinearLayout)findViewById(R.id.layout1);
Set the height of the layout based on the screen height you got earlier:
LayoutParams params = layout.getLayoutParams();
params.height = screenHeight - getStatusBarHeight();
Done. Be sure to call all of those methods in your onCreate method.
Hope this helps!
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