I am making an Android app, whose main.xml file is like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background_full">
<Button android:id="#+id/nxt_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_marginLeft="170dp"
android:layout_marginTop="100dp"
android:background="#drawable/button_background"/>
<Button android:id="#+id/back_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_marginLeft="360dp"
android:layout_marginTop="100dp"
android:background="#drawable/button_background"/>
<com.broov.player.DrawView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawingSurface"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:visibility="visible" />
</RelativeLayout>
In my emulator it's working fine, but when the device or emulator resolution changes the layout became distracted. I need the layout to be universal for every machine.
you need to specify the relationship of components in your layout : toLeftOf or toRightOf.
Related
I've already seen many tutorials trying to put an image as background of my main activity. Tested many ways, and now I'm with this:
<?xml version="1.0" encoding="utf-8"?>
<merge
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView"
android:src="#drawable/library"
android:scaleType = "centerCrop"
android:contentDescription="#string/bckgrndimg" />
<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="#ffffff"
android:orientation="vertical"
>
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="370dp"
android:layout_marginLeft="0dp"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true">
</ListView>
<Button
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/nuevo_libro"
android:id="#+id/nuevoLibro"
android:layout_above="#android:id/list"
android:layout_centerHorizontal="true"
android:layout_marginBottom="42dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="#string/biblioteca_virtual"
android:id="#+id/textView2"
android:layout_above="#+id/nuevoLibro"
android:layout_centerHorizontal="true"
android:layout_marginBottom="31dp" />
</RelativeLayout>
</merge>
Ok, this should go ok, shouldn't it? My "library" image is a 900x600 PNG image, but it just doesn't show up on the screen.
Am I missing something?
Thank you!
Do you need an Image View?
You could do something like this:
<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/library.."
...
>
...
</RelativeLayout>
Change Background color of RelativeLayout
android:background="#ffffff"
To
android:background="#android:color/transparent"
I'm targeting API level 21 and min is also 21 (I support Lollipop only for now, it's a pet project to learn).
I'm having problems with a custom ListView item layout. Here is my XML:
<?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="wrap_content">
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_marginEnd="10dp"
android:background="#FF0000"
android:src="#drawable/ic_test"
tools:ignore="ContentDescription"/>
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/test_list_item_icon"
android:textSize="50sp"/>
</RelativeLayout>
And here is what it looks like (the icon's red background color is only to see how big the actual view is):
I would like the image view to behave like the following: take up the available vertical space at the 'start'/left of the layout, have the image scale proportionally, and have the width be grown so that the image can be fully shown, like this (pardon my gimp skills):
Is it possible?
Try this for your ImageView
<?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">
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_marginEnd="10dp"
android:background="#FF0000"
android:src="#drawable/ic_test"
android:adjustViewBounds="true"
android:scaleType="fitXY"
tools:ignore="ContentDescription"/>
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/test_list_item_icon"
android:textSize="50sp"/>
</RelativeLayout>
In the end I decided to create one more icon size, xxxhdpi, and it all looks nice now.
Many thanks to #corsair992 for information about the bug in one of the comments.
HI wujek the reason for your problem is you set height as wrap content for your relative layout . so it will take the textview's height as its height .then image view will use this as its height .so change relative layout height to match parent. Please try and let me know thanks
<?xml version="1.0" encoding="utf-8"?>
<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="wrap_content" >
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_marginEnd="10dp"
android:adjustViewBounds="true"
android:background="#ff0000"
android:src="#drawable/ic_launcher"
tools:ignore="ContentDescription" />
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/layout_1"
android:gravity="center"
android:text="bhsbd"
android:textSize="50sp" />
try this
if u want to image should capture imageview size use background insted src.
if red background is mandatory use another relative layout as parent for imageview.
hope it works fo u..
<?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="wrap_content" >
<RelativeLayout
android:id="#+id/layout_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="#FF0000" >
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="10dp"
android:background="#drawable/ic_launcher"
android:adjustViewBounds="true"
tools:ignore="ContentDescription" />
</RelativeLayout>
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/layout_1"
android:textSize="50sp" />
</RelativeLayout>
edit 2
<?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="wrap_content" >
<RelativeLayout
android:id="#+id/layout_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/test_list_item_name"
android:layout_alignTop="#+id/test_list_item_name"
android:background="#FF0000" >
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:src="#drawable/ic_launcher"
android:adjustViewBounds="true"
tools:ignore="ContentDescription" />
</RelativeLayout>
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/layout_1"
android:textSize="50sp"
android:text=" text 5>" />
</RelativeLayout>
Define a LineatLayout with weightsum.
<LinearLauyout
----
android:orientation="horizontal"
android:weightSum="5">
<ImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4">
</LinearLayout>
you can adjust the weightsum as per your requirement.
My intent is to create a list of widgets on a scroll view, with an ImageView in the centre of the screen behind them. Here is what I have, there will be more buttons when all is said and done:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:contentDescription="#string/description"
android:src="#drawable/myImage"
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:scaleType="centerInside" />
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="#android:color/transparent">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:background="#android:color/transparent">
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/newButton"
style="#style/homeScreenButton"
android:text="#string/new_profile" />
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/loadButton"
style="#style/homeScreenButton"
android:text="#string/load_profile" />
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/calculatorButton"
style="#style/homeScreenButton"
android:text="#string/calculator" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
On eclipse's xml graphical layout interpreter, the screen is shown as expected. The same is true with the 2 different emulators that I tried, Android 2.2 and Android 4.0.3. But when I send to my actual device, Droid 4 w/Android 4.1.2 the image simply does not show up. I even tried making the ScrollView transparent (android:alpha="0") thinking that it was somehow covering the image up, but nothing. Any suggestions would be greatly appreciated.
try eliminating this line from ImageView,
xmlns:android="http://schemas.android.com/apk/res/android"
it should be present only in the RelativeLayout
so your xml file become
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:contentDescription="#string/description"
android:src="#drawable/myImage"
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:scaleType="centerInside" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="#android:color/transparent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:background="#android:color/transparent">
<Button
android:id="#+id/newButton"
style="#style/homeScreenButton"
android:text="#string/new_profile" />
<Button
android:id="#+id/loadButton"
style="#style/homeScreenButton"
android:text="#string/load_profile" />
<Button
android:id="#+id/calculatorButton"
style="#style/homeScreenButton"
android:text="#string/calculator" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
I figured it out, the code was fine. My problem was that the image was in /res/drawable but it needed to be in /res/drawable-hdpi.
I am developing a new Android application. I need to design the below screenshot in my application . I am using eclipse IDE.
Using the below code I formed the above shown screen-shot. But whenever I choose the different screen previews ( 4.7’’ WXGA , 4.0” WXGA etc., ) am getting the inner images which are marked with arrows in the below scree shot are misaligned. The below is the screen shot which is an example. All the images in the layout are icons ( Ex., home, share ).
<?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="match_parent"
android:background="#drawable/bar"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.9" >
<ImageView
android:id="#+id/imageView2"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_marginTop="240dp"
android:layout_weight="1.00"
android:src="#drawable/rec_button_stop"
android:visibility="gone" />
</LinearLayout>
<LinearLayout android:id="#+id/linearLayout3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.1" >
<ImageView android:id="#+id/imageView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="40dip" android:layout_marginTop="90dip"/>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="40dip"
android:layout_marginTop="90dip"
android:src="#drawable/home" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.1" >
<ImageView
android:id="#+id/imageView2"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1.00"
android:src="#drawable/rec_button_stop" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.1" >
<ImageView
android:id="#+id/imageView2"
android:layout_width="30dp"
android:layout_height="fill_parent"
android:layout_marginLeft="10dip"
android:src="#drawable/share" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
So I need the samller images ( icons which are marked with arrows) to be fixed at the same position ( in straight line ) whenever I change the screen priviews with different sizes.
Can some one guide me with some code snippets or with some links.
#2Vision2 : This problem is caused because you have used fixed margin in layout components.
For supporting various size devices you have to create different layouts. You are facing this problem because you are using only single layout. Create 4 directories in res/ directory in your app for layouts of all sizes
layout (for devices below 4")
layout-800X480 (for devices above 4" & below 5")
layout-sw620dp (for 7" tablets)
layout-sw800dp (for 10" tablets)
Also if want to create different layouts for landscape mode then create layout-land, layout-land-800X480,.. directories for supporting app in landscape mode also.
try this xml file,this will work universally in all sizes(land & port)!actually you may be using wrong way to use weight.
hope this will help you getting idea how to set layout and gravity,with the use of WEIGHT.
<?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="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight=".75" >
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight=".25"
android:background="#android:color/darker_gray" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight=".20"
android:gravity="center" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight=".60"
android:gravity="center|top" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight=".20"
android:gravity="center" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
weight can be also used in Relative Layout.but preffered way to use it with linear Layout.
still any query, plz ask...
I want to ask, working with two or more nested RelativeLayout.
First code looks like picture 1, When I add android:layout_alignParentRight="true" in second RelativeLayout, this looks like picture 2. I want to align text right to second RelativeLayout. Where is my fault?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:background="#drawable/background"
android:layout_height="wrap_content"
android:id="#+id/testRL">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:id="#+id/testRotateLL"
android:background="#drawable/picture_border_offer_first_page">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="7000TL"
android:textSize="15sp"
android:textColor="#android:color/white"
android:id="#+id/amountLayoutTV" />
</RelativeLayout>
</RelativeLayout>
Picture 1:
And I add android:layout_alignParentRight="true"
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:background="#drawable/background"
android:layout_height="wrap_content"
android:id="#+id/testRL">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:id="#+id/testRotateLL"
android:background="#drawable/picture_border_offer_first_page">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="7000TL"
android:layout_alignParentRight="true"
android:textSize="15sp"
android:textColor="#android:color/white"
android:id="#+id/amountLayoutTV" />
</RelativeLayout>
</RelativeLayout>
Picture 2:
This question is unanswered. when I updated ADT version, this problem solved. There was a bug, I think.
I suggest you to check version of ADT sometimes...
In the first RelativeLayout you have:
android:layout_width="wrap_content"
android:layout_height="wrap_content"
You probably want:
android:layout_width="fill_parent"
android:layout_height="fill_parent"