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 -->
Related
I want to create custom toast with, one view which is a little bit out of parent. So I did something like this
This is my custom toast
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/toast_root"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="50dp"
android:background="#000000"
android:clipChildren="false"
android:clipToPadding="false"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="15dp">
<TextView
android:id="#+id/digit_display"
android:layout_width="96dp"
android:layout_height="96dp"
android:layout_marginTop="-24dp"
android:layout_marginEnd="15dp"
android:layout_marginBottom="24dp"
android:background="#drawable/round_button"
android:gravity="center"
android:text="1"
android:textSize="64sp" />
<TextView
android:id="#+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:text="TextView"
android:textColor="#FFFFFF"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
round_button.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false">
<shape android:shape="oval">
<solid android:color="#000000"/>
</shape>
</item>
<item android:state_pressed="true">
<shape android:shape="oval">
<solid android:color="#2C2C2C"/>
</shape>
</item>
</selector>
and in java code I am using it like this
LayoutInflater li = getLayoutInflater();
View v = li.inflate(R.layout.toast, null);
TextView numberView = v.findViewById(R.id.digit_display);
TextView descriptionView = v.findViewById(R.id.description);
numberView.setText(number);
descriptionView.setText(description);
Toast t = new Toast(getApplicationContext());
t.setDuration(Toast.LENGTH_LONG);
t.setView(v);
t.show();
And I can see my toast. But digit_display TextView is clipped from the top but I would like to see it out of toast (just top of that view). How can I achieve it? If that does not work.
EDITED
I try to understand why this example does not work, when if I am using similar structure in other project form simple form it is working.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="25dp"
android:background="#drawable/form_desing"
android:clipChildren="false"
android:clipToPadding="false"
android:gravity="center"
android:orientation="vertical"
android:padding="25dp">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="-50dp"
android:layout_marginBottom="50dp"
android:foreground="#drawable/clover_"
android:contentDescription="#string/fourbit_clover_icon" />
<include layout="#layout/email_input" />
<include layout="#layout/password_input" />
<include layout="#layout/buttons" />
</LinearLayout>
any idea?
Think of outer-most Layout as your Toast's root view and arrange items inside it. You're NOT limited to only use one LinearLayout or RelativeLayout . Don't try to go out from root view: It will get clipped.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:gravity="top|center">
<LinearLayout
android:layout_height="50dp"
android:layout_width="wrap_content"
android:orientation="horizontal"/>
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="200dp"
android:orientation="vertical"
android:gravity="center"
android:padding="15dp"
android:background="#0A93E1"
android:minHeight="100dp"
android:layout_marginTop="30dp">
</LinearLayout>
<TextView
android:layout_height="60dp"
android:layout_width="60dp"
android:text="Text"
android:id="#+id/digit_display"
android:background="#drawable/round_button"
android:gravity="center"
android:layout_centerHorizontal="true"
android:textColor="#FFFFFF"/>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Text"
android:id="#+id/description"
android:layout_below="#id/digit_display"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp"
android:textColor="#FFFFFF"/>
</RelativeLayout>
</LinearLayout>
Well I have achieved the rounded corner goal in alert dialog box but it has taken all the left and right side.
My question is like I want some space between left and right of the dialog box
Here is my code:Custom dialog
<?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="wrap_content"
android:orientation="vertical"
android:background="#drawable/custom_dialog"
>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="SELECT PHOTO"
android:textSize="15dp"
android:paddingBottom="12dp"
android:paddingTop="12dp"
android:layout_marginLeft="20dp"></TextView>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/hint_color"></View>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="15dp"
android:id="#+id/Select_photo_from_Camera">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/camera_24dp"
android:layout_marginLeft="22dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Camera"
android:layout_marginLeft="10dp"
></TextView>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<View
android:layout_width="600dp"
android:layout_height="1dp"
android:layout_marginTop="10dp"
android:background="#color/hint_color"></View>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="15dp"
android:paddingBottom="5dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_photo_library_black_24dp"
android:layout_marginLeft="22dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gallery"
android:layout_marginLeft="10dp"
/>
</LinearLayout>
</LinearLayout>
Code for :Custom_dialog.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid
android:color="#color/white"></solid>
<corners
android:radius="5dp"
></corners>
<padding
android:top="6dp"
android:bottom="6dp"></padding>
</shape>
Here is the Output of my achievement:
https://i.stack.imgur.com/7G0Go.png
Create a inset and set as background, that may help
<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="#drawable/your_background_image"
android:insetRight="25dip"
android:insetLeft="25dip" />
use
android:background="#drawable/inset_background"
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>
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 am trying to wrap a relative layout in a scroll view as shown below, however it is not working. I cannot see the last text box which is off screen and cannot scroll down on the screen.
<?xml version="1.0" encoding="UTF-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scroller"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/background"
android:orientation="horizontal"
>
<TextView
android:id="#+id/namedetail"
android:background="#drawable/backgroundstate"
android:layout_width="fill_parent"
android:gravity="center_vertical|center_horizontal"
android:layout_height="50dip"
android:textColor="#FF000000"
android:textStyle="bold"
android:textSize="15sp"
android:typeface="sans"
/>
<ImageView android:id="#+id/picturedetail"
android:layout_width="175dip"
android:layout_height="175dip"
android:layout_below="#id/namedetail"
android:layout_marginLeft="75dip"
android:layout_marginTop="10dip"
/>
<ImageView android:id="#+id/infoboxdetail"
android:layout_width="225dip"
android:layout_height="100dip"
android:layout_marginLeft="50dip"
android:layout_marginTop="10dip"
android:layout_below="#id/picturedetail"
android:background="#drawable/backgroundstate"
/>
<TextView
android:id="#+id/descriptiondetail"
android:background="#drawable/backgroundstate"
android:layout_width="fill_parent"
android:gravity="center_vertical|center_horizontal"
android:layout_height="50dip"
android:textColor="#FF000000"
android:textStyle="bold"
android:textSize="15sp"
android:typeface="sans"
android:layout_below="#id/infoboxdetail"
android:layout_marginTop ="10dip"
/>
</RelativeLayout>
</ScrollView>
try with
android:orientation="vertical" in relative layout..