I have this recyclerview, and the background is made with imageviews. I have these two situations in portrait and landscape. How do I fill the white space there with a new imageview or something with the same color?
And this is my xml:
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/home_imageview_superbackground"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true" />
<ImageView
android:id="#+id/home_imageview_background"
android:contentDescription="Background image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:layout_alignParentEnd="true" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true">
<TextView
android:id="#+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="casual"
android:paddingBottom="10dp"
android:paddingStart="5dp"
android:paddingTop="10dp"
android:textAppearance="?attr/textAppearanceListItem"
android:textColor="#android:color/white"
android:textSize="40sp" />
</RelativeLayout>
Tried several ways, but I'm just not able to make this work. #+id/home_imageview_superbackground this is the imageview I want to put on the left of each background imageview to fill that space in the landscape. Thank you for the help.
Please try this one
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/home_imageview_superbackground"
android:layout_width="match_parent"
android:src="#mipmap/ic_launcher"
android:scaleType="fitXY"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/home_imageview_background"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"
android:scaleType="fitXY"
android:contentDescription="Background image" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true">
<TextView
android:id="#+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="casual"
android:paddingBottom="10dp"
android:paddingTop="10dp"
android:textAppearance="?attr/textAppearanceListItem"
android:textColor="#android:color/white"
android:textSize="40sp" />
</RelativeLayout>
</RelativeLayout>
You can also use android:scaleType="centerCrop".
Hope this will help you..If still you face problem please inform me...
<ImageView
android:layout_width="match_parent"
.... />
Also you can use scaleTypeattribute
First, the fill_parent is deprecated times ago, you should use match_parent instead. Then, you have also to use scaleType when you're working with ImagesView to define how the image looks on the screen. In your case, working with scaleType = "fitXY" solve your problem.
How your code should be :
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/home_imageview_superbackground"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:layout_alignParentStart="true" />
<ImageView
android:id="#+id/home_imageview_background"
android:contentDescription="Background image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:adjustViewBounds="true"
android:layout_alignParentEnd="true" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true">
<TextView
android:id="#+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="casual"
android:paddingBottom="10dp"
android:paddingStart="5dp"
android:paddingTop="10dp"
android:textAppearance="?attr/textAppearanceListItem"
android:textColor="#android:color/white"
android:textSize="40sp" />
</RelativeLayout>
Try this code
<?xml version="1.0" encoding="utf-8"?><?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/your_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"
android:scaleType="fitEnd"
android:layout_alignParentStart="true"
android:background="#drawable/green_gradiant"
android:padding="10dp" />
<TextView
android:id="#+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="casual"
android:paddingBottom="10dp"
android:paddingStart="5dp"
android:paddingTop="10dp"
android:text="Hello Three"
android:textAppearance="?attr/textAppearanceListItem"
android:textColor="#android:color/white"
android:textSize="40sp" />
</FrameLayout>
And create this drawable file
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<gradient android:angle="0"
android:startColor="#64FFDA"
android:centerColor="#4464FFDA"
android:endColor="#0064FFDA"/>
</shape>
</item>
</selector>
Related
I'm confused why android:layout_below is not working, I just need to put the button below the border line and I don't wanna use android:layout_marginTop="570dp because the android phone has different sizes, Is somebody know how can I arrange the layout of this? it helps me a lot thanks in advance.
This is what I want to achieve
<?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:orientation="vertical"
tools:context=".MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="15dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="100dp"
android:background="#drawable/selector_fieldset_background"
android:orientation="vertical"
android:id="#+id/linearl">
</RelativeLayout>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#color/white"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:text="Cash Card Scanner"
android:textSize="15dp"
android:textAppearance="?android:attr/textAppearanceLarge"/>
<Button
android:id="#+id/button2"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="SCAN"
android:layout_below="#+id/linearl"
/>
</RelativeLayout>
Drawable selector_fieldset_background.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#FFFFFF" />
<stroke
android:width="2dip"
android:color="#25000000" />
</shape>
Just try this, works for me:
<?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:orientation="vertical"
tools:context=".MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="15dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="10dp"
android:background="#drawable/selector_fieldset_background"
android:orientation="vertical"
android:id="#+id/linearl"
android:layout_above="#+id/button2"
>
</RelativeLayout>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#color/white"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:text="Cash Card Scanner"
android:textSize="15dp"
android:textAppearance="?android:attr/textAppearanceLarge"/>
<Button
android:id="#+id/button2"
android:layout_centerInParent="true"
android:layout_width="match_parent"
android:layout_height="90dp"
android:text="SCAN"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>
I am working on an android project where i am trying to create an image like a star inside a circle
like this one
I have tried but i am unable to resize the star.
Every time i try to resize star android studio resize my whole image
this is my circle shape xml:
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#color/darkPurple"/>
<size
android:width="50dp"
android:height="50dp"/>
</shape>
this is my star xml:
<vector android:autoMirrored="true" android:height="1dp"
android:tint="#FFB404" android:viewportHeight="24"
android:viewportWidth="24" android:width="1dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#android:color/white" android:pathData="M12,17.27L18.18,21l-1.64,-7.03L22,9.24l-7.19,-0.61L12,2 9.19,8.63 2,9.24l5.46,4.73L5.82,21z"/>
</vector>
This is my layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ImageView
android:layout_gravity="center"
android:background="#drawable/circle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_baseline_star_24"
>
</ImageView>
<TextView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Markets"
android:textColor="#color/white"
>
</TextView>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_gravity="center"
android:background="#drawable/circle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_baseline_star_24"
>
</ImageView>
<TextView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Markets"
android:textColor="#color/white"
>
</TextView>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_gravity="center"
android:background="#drawable/circle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_baseline_star_24"
>
</ImageView>
<TextView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Markets"
android:textColor="#color/white"
>
</TextView>
</LinearLayout>
</LinearLayout>
Please tell me how can i do this
I had the similar problem and I fixed it using below methods.
You can either add padding inside your ImageView
<ImageView
android:layout_gravity="center"
android:background="#drawable/circle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_baseline_star_24"
android:padding="16dp"> <!-- Here is the change -->
or set scaleType attribute in ImageView to fit according to your need.
<ImageView
android:layout_gravity="center"
android:background="#drawable/circle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_baseline_star_24"
android:scaleType="centerInside"> <!-- Here is the change -->
I'm trying to do this for months and finally i can't find anyway. Elevation is just for API 21+ and other ways sometimes work and sometimes doesn't. I'm working on a music player and i need shadow between music controller and musics cover. How to add shadow? elevation doesn't work here as you can see
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<ImageView
android:id="#+id/now.playing.cover"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:scaleType="centerInside"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimaryDark"
android:gravity="center_horizontal"
android:orientation="vertical"
android:padding="8dp">
<TextView
android:id="#+id/now.title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="1"
android:textColor="#color/colorSecondaryText" />
<TextView
android:id="#+id/now.artist"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="1"
android:textColor="#color/colorSecondaryText" />
<TextView
android:id="#+id/now.album"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="1"
android:textColor="#color/colorSecondaryText" />
<android.support.v7.widget.AppCompatSeekBar
android:id="#+id/now.seek"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="32dp"
android:layout_marginTop="8dp"
android:paddingRight="32dp">
<ImageView
android:id="#+id/prev"
android:layout_width="36dp"
android:layout_height="36dp"
android:layout_marginRight="56dp"
android:padding="2dp"
android:src="#drawable/prev" />
<ImageView
android:id="#+id/pp"
android:layout_width="36dp"
android:layout_height="36dp"
android:layout_marginRight="56dp"
android:padding="2dp"
android:src="#drawable/play" />
<ImageView
android:id="#+id/next"
android:layout_width="36dp"
android:layout_height="36dp"
android:padding="2dp"
android:src="#drawable/next" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
You can add a view in between which looks like shadow..
Below is an example of same which I have used and it almost works on all the apis.. May be it can help you..
Shadow View:
<View
android:id="#+id/toolbar_shadow"
android:layout_width="match_parent"
android:layout_height="15dp"
android:layout_below="#+id/toolbar"
android:background="#drawable/toolbar_shadow" />
And the drawable file:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<gradient
android:angle="90"
android:endColor="#88444444"
android:startColor="#00000000" />
</shape>
I have RelativeLayout and inside it, there is an ImageView and a TextView, in that order. I want the ImageView to have height of match_parent but I want the RelativeLayout to have height of wrap_content of the TextView inside it. How can I make it so?
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/photo"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
Use this it will work as I understand your problem
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#CC0000" >
<ImageView
android:id="#+id/photo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:background="#FF9966"
android:layout_alignBottom="#+id/content"
android:layout_alignTop="#+id/content"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_toRightOf="#+id/photo"
android:id="#+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#FF3399"
android:text="asdjajdasdjajdasdjaddtegrgfhfhfhfhhfh" />
</RelativeLayout>
Try this..
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/photo"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<TextView
android:id="#+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
I want a RelativeLayout based android UI that looks like the below mock graphic:
Below is my layout xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayoutForPreview"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- surface view that contains camera preview , and seats above #+id/linearLayoutToolbar -->
<SurfaceView
android:id="#+id/surfaceViewBarcodeScanner"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<!-- LinearLayout that contains toolbar that is divided into 3 sections horizontally -->
<LinearLayout
android:id="#+id/linearLayoutToolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/surfaceViewBarcodeScanner"
android:orientation="horizontal" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/scanner_bottom_left" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/scanner_bottom_center_toolbar" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/scanner_bottom_right_landscape_button" />
</LinearLayout>
</RelativeLayout>
I used Eclipse GUI palette and my own editing , however the output was not what I expected, the SurfaceView seems to covering all the screen, the LinearLayout at the bottom does not appear.
Snapshot of my current result on Galaxy S3 device:
Any help will be appreciated, Thanks.
Could you please try out to modify your layout as the follows:
Define your SurfaceView and set it's layout_above value to the ID of the linear layout made in the previous step. Set the layout_alignParentTop to true.
Define your bottom linear layout and set the layout_alignParentBottom to true.
Smart code snippet with only the important parts:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android">
<SurfaceView
android:id="#+id/surfaceViewBarcodeScanner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_above="#+id/linearLayoutToolbar" />
<LinearLayout
android:id="#+id/linearLayoutToolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" />
</RelativeLayout>
I hope this will solve your problem.
you can use Linearlayout instead of Realtive Layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<SurfaceView
android:id="#+id/surfaceViewBarcodeScanner"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" />
<LinearLayout
android:id="#+id/linearLayoutToolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<!-- inside elements -->
</LinearLayout>
</LinearLayout>
else you should use android:layout_above="#+id/linearLayoutToolbar" to your surfaceview
and remove android:layout_below attribute and add android:layout_alignParentBottom="true" to your toolbar view.
// try this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayoutForPreview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp"
android:orientation="vertical">
<LinearLayout
android:layout_height="0dp"
android:layout_weight="1"
android:layout_width="match_parent">
<SurfaceView
android:id="#+id/surfaceViewBarcodeScanner"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayoutToolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="0dp"
android:gravity="center"
android:layout_weight="1">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/scanner_bottom_left" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="0dp"
android:gravity="center"
android:layout_weight="2">
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/scanner_bottom_center_toolbar" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="0dp"
android:gravity="center"
android:layout_weight="1">
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/scanner_bottom_right_landscape_button" />
</LinearLayout>
</LinearLayout>
</LinearLayout>