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" />
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 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
I have to make a screen in android . and add some UI elements to it .
I want to know is there a way to add element on UI if i know at what percentage height from bottom that element is to be placed . And i know the size of the element in dp , like (32dp * 44 dp).
First you have to calculate the height and width of device runtime and according to those figures you need to define your percentage height and width.
You can find the height and width at runtime as following
displaymetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
screenHeight = displaymetrics.heightPixels;
screenWidth = displaymetrics.widthPixels;
Use LinearLayout and weight param if you wish to set a percentage ratio
Example:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/parent"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/one"
android:id="#+id/view_1"
android:layout_weight="0.8"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/two"
android:id="#+id/view_2"
android:layout_weight="0.2"/>
</LinearLayout>
Here view_1 gets 80% of parent height and view_2 gets 20%.
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)
This question already has answers here:
Is it possible to Adjust height of listview with respect to screen size when it is used with adapter
(2 answers)
Closed 8 years ago.
Please consider the code given code.
How to make these image heights are of 1/3 of screen size. if i use it with an adapter.
Please refer the image
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="0dip" android:layout_gravity="top"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="5dp"
android:paddingLeft="10dp"
android:paddingTop="5dp" >
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="left|top"
android:scaleType="centerCrop"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/imaget"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="left|top"
android:layout_weight="1"
android:scaleType="centerCrop"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</TableLayout>
You can get the width and height of the screen and set one parameter for both
layout_width and layout_height of button.
How??
Display display=((WindowManager)getSystemService(Context.WINDOW_SERVICE)).
getDefaultDisplay();
int width=display.getWidth();
int height=display.getHeight();
//Calculate width and height
Say For screen 240*320
buttonWidth=width/5; result: buttonWidht=48;
buttonHeight=height/10 result: buttonHeight=32;
Using LayoutParams object, set width and height to the button.
Now, if you run this code on device having screen size 320*480
buttonWidth=width/5; result: buttonWidht=64;
buttonHeight=height/10 result: buttonHeight=48;
and so on for other devices too.
Maybe look at the SAME QUESTION you posted an hour ago that has been answered?
Is it possible to Adjust height of listview with respect to screen size when it is used with adapter
Try this.
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
int density = metrics.densityDpi;
int width = 0, height = 0;
metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
//height is actual screen height
height = metrics.heightPixels;
width = metrics.widthPixels;
CustomAdapter mAdapter;
//pass h to your adapter class and it will gives you the height as per you need
h=height/3;
mAdapter = new CustomAdapter(this,ImageArrayList1, ImageArrayList2,h);