the elevation is not working even after adding padding to the view, here is the Relative layout, what else I should add for a shadow in the image view.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#+id/tvContinueWith"
android:layout_marginTop="#dimen/_10dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imgFb"
android:layout_alignParentStart="true"
android:layout_centerInParent="true"
android:elevation="#dimen/_5dp"
android:src="#drawable/fb"
/>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imgGoogle"
android:layout_toRightOf="#+id/imgFb"
android:layout_marginLeft="#dimen/_5dp"
android:layout_centerInParent="true"
android:src="#drawable/google"
android:elevation="#dimen/_5dp"
/>
</RelativeLayout>
I use the code below to add shadow to any View that looks circular. Works on Lollipop and above.
myCircularImageView.setOutlineProvider(new ViewOutlineProvider() {
#Override
public void getOutline(View view, Outline outline) {
outline.setOval(0, 0, view.getWidth(), view.getHeight());
}
});
myCircularImageView.setClipToOutline(true);
I don't encourage using CardView because it makes your layout more complex.
you can use cardview as parent layout of relative layout & give the elevation to cardview. It will give shadow to your imageview. Hope it will work for you.
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cardElevation="5dp"
app:cardCornerRadius="5dp"
card_view:cardBackgroundColor="#color/colortransperent">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#+id/tvContinueWith"
android:layout_marginTop="#dimen/_10dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imgFb"
android:layout_alignParentStart="true"
android:layout_centerInParent="true"
android:elevation="#dimen/_5dp"
android:src="#drawable/fb"
/>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imgGoogle"
android:layout_toRightOf="#+id/imgFb"
android:layout_marginLeft="#dimen/_5dp"
android:layout_centerInParent="true"
android:src="#drawable/google"
android:elevation="#dimen/_5dp"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
Easy way is to use textview in a card view and then add shadow to it using
android:elevation="", see this on how to use CardView.
Best is to use CardView and add the RelativeLayout inside the CardView and fill it with match_parent.
Then use 'elevation' attribute of CardView
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:elevation="5dp">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#+id/tvContinueWith"
android:layout_marginTop="#dimen/_10dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imgFb"
android:layout_alignParentStart="true"
android:layout_centerInParent="true"
android:elevation="#dimen/_5dp"
android:src="#drawable/fb"
/>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imgGoogle"
android:layout_toRightOf="#+id/imgFb"
android:layout_marginLeft="#dimen/_5dp"
android:layout_centerInParent="true"
android:src="#drawable/google"
android:elevation="#dimen/_5dp"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
Dependency for CardView
implementation 'com.android.support:cardview-v7:28.0.0'
Related
I'm working with a class that extends Dialog. It should display a progressbar element. Sometimes there will be a message, sometimes there isn't.
The progressbar shows when there is no message but does not show when there is a message and I do not understand why.
Here is the layout code:
<TextView
android:id="#+id/dialog_message"
style="#style/arial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:layout_marginLeft="100dp"
android:layout_marginRight="100dp"
android:layout_marginBottom="20dp"
android:text=""
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="18sp"
/>
<ProgressBar
android:id="#+id/progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="30dp"
android:layout_marginLeft="100dp"
android:layout_marginRight="100dp"
android:layout_marginTop="10dp"
android:visibility="gone" />
Here is the java:
public void progressDialog () {
if(this.message.getText().length() > 0){
message.setVisibility(View.VISIBLE);
}else{
message.setVisibility(View.GONE);
}
progress.setVisibility(View.VISIBLE);
leftButton.setVisibility(View.GONE);
rightButton.setVisibility(View.GONE);
}
When message is set GONE the progressbar shows, when message is set VISIBLE the progressbar does not show. I assume it is getting hidden by the message somehow.
I've tried moving it around in the layout as this question might suggest was needed ProgressBar not displaying, but to no avail.
How do I get the progressbar to always show when calling progressDialog()?
Edit***** Added full layout xml
<?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:background="#drawable/dialog_background"
android:orientation="vertical">
<TextView
android:id="#+id/dialog_title"
style="#style/arialBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="5dp"
android:layout_marginTop="35dp"
android:ellipsize="end"
android:maxLines="1"
android:text="#string/waiting"
android:textColor="#android:color/white"
android:textSize="21sp" />
<TextView
android:id="#+id/dialog_message"
style="#style/arial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="30dp"
android:text=" "
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="20sp" />
<ProgressBar
android:id="#+id/progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="30dp"
android:layout_marginLeft="100dp"
android:layout_marginRight="100dp"
android:layout_marginTop="30dp"
android:visibility="gone" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="30dp"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/dialog_button_one"
style="#android:style/Widget.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#color/purple"
android:orientation="horizontal">
<TextView
android:id="#+id/dialog_button_one_text"
style="#style/arialBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="#dimen/alert_dialog_button_margin_left_right"
android:layout_marginRight="#dimen/alert_dialog_button_margin_left_right"
android:layout_marginTop="10dp"
android:ellipsize="end"
android:maxLines="1"
android:textColor="#android:color/white"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/dialog_button_two"
style="#android:style/Widget.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="20dp"
android:background="#color/purple"
android:orientation="horizontal">
<TextView
android:id="#+id/dialog_button_two_text"
style="#style/arialBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="#dimen/alert_dialog_button_margin_left_right"
android:layout_marginRight="#dimen/alert_dialog_button_margin_left_right"
android:layout_marginTop="10dp"
android:ellipsize="end"
android:maxLines="1"
android:textColor="#android:color/white"
android:textSize="20sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I think you are using linear layout. So use Relative Layout instead of linear layout.
Add a parent constraint layout to your linear layout and move progress bar out of linear layout.
<constraint>
<linear/>
<progress/>
</constraint>
Some thing like this:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/dialog_background"
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
>
<!-- Your complete layout -->
</LinearLayout>
<ProgressBar
android:id="#+id/progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:visibility="gone" />
</android.support.constraint.ConstraintLayout>
Ok, it looks like you use some wrong property for what you want, look:
android:layout_gravity="center" will put your TextView in center of the layout, but you also set it in your ProgressBar this mean that only one of then will be shown, it is only useful when you want to show one view at time, if you want to show both, try to remove one of this property.
Another thing, you set android:layout_margin="30dp" on TextView, so your progressBar will be far removed from TextView, which may also cause the invisibility of the ProgressBar, try 16dp.
<TextView
android:id="#+id/dialog_message"
style="#style/arial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" // remove here or in ProgressBar
android:layout_margin="16dp" // I just replace 30dp to 16dp
android:text=" "
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="20sp" />
EDIT - Another Answer
I edit your full XML code, replacing some margin with padding, and show the progressBar always. You can now hide/show the textView or progressbar, it should work.
I also replace some property, since I have not it here, make sure to add again. Hope it help you.
I recommend to use RelativeLayout to improve your UI. Below I show the current XML behavior.
When ProgressBar is showed
The full source code on link below, I am unable to paste the code here.
https://gist.github.com/pedromassango/a6dc213823b297931f1ef2e6b6954466
I have 2 rows of "buttons" which are composed of a vertical LinearLayout of an ImageView and a TextView. The problem I'm having right now is trying to set the ImageView aspect ratio without hardcoding its dimensions.
I have already tried playing with the layout weights but it still forces the TextView to be partially cut off.
The xml structure I have is 2 horizontal LinearLayouts and each button is described above.
I've included a picture of my problem. You can see the first button is forcing the TextView out of the bounds. The rest of the buttons you see are hardcoded dimensions, but I don't want to do that because smaller screen sizes won't work.
Here is my layout for one button:
<LinearLayout
android:gravity="center_horizontal"
android:layout_weight="1"
android:padding="5dp"
android:orientation="vertical"
android:layout_width="0dip"
android:layout_height="match_parent">
<ImageView
android:id="#+id/setting_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:background="#null"
android:clickable="true"
android:onClick="openSettings"
android:src="#drawable/menu" />
<TextView
android:id="#+id/setting_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Settings"
android:textAlignment="center"
android:textColor="#android:color/white"
android:autoSizeTextType="uniform" />
</LinearLayout>
Try using images with lower dimensions.
Try using a RelativeLayout and setting the TextView as anchor for the image:
<RelativeLayout
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:padding="5dp">
<TextView
android:id="#+id/setting_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:text="Settings"
android:textAlignment="center"
android:textColor="#android:color/white"
android:autoSizeTextType="uniform" />
<ImageView
android:id="#+id/setting_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#id/setting_text"
android:scaleType="centerInside"
android:adjustViewBounds="true"
android:background="#null"
android:clickable="true"
android:onClick="openSettings"
android:src="#drawable/menu" />
</RelativeLayout>
I want make JPG image of my one cardview and want share it on select overflow menu. My XML file is like below, How can I make screenshot of one view called #quoteCard and share it ? and I want just one view of my layout not want full screen screenshot. Thanks
<LinearLayout
android:id="#+id/cardBackground"
android:padding="8dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_marginTop="32dp"
android:layout_gravity="center_horizontal"
android:id="#+id/authorImage"
android:layout_width="128dp"
android:layout_height="128dp"
app:civ_border_width="2dp"
app:civ_border_color="#99333333"/>
<TextView
android:layout_weight="1"
android:gravity="center"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:id="#+id/textDetailQuote"
android:text="The price of success is hard"
android:textSize="20sp"
android:textStyle="bold"
android:lineSpacingExtra="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:layout_marginBottom="16dp"
android:layout_marginRight="8dp"
android:id="#+id/textAuthorSign"
android:layout_gravity="right"
android:text="- ABJ Abdul Kalam"
android:textStyle="italic"
android:textSize="16sp"
android:typeface="serif"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
you can try this for take particular layout screen shot
LinearLayout mLinearLayout= (LinearLayout) findViewById(R.id.linearlayout);
mLinearLayout.setDrawingCacheEnabled(true);
Bitmap mBitmap = Bitmap.createBitmap(mainLayout.getDrawingCache());
mLinearLayout.setDrawingCacheEnabled(false);
Using above you can convert layout to bitmap.
Hello I'm trying to figure how to work with LinearLayouts. I dragged one horizontal layout to my XML file, I then dragged three TextView one next to each other. When I'm trying to drag ImageView and place it below them, it always pushes the TextView aside. How can I fix this?
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="397dp"></LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView"
android:layout_gravity="center_vertical" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="70dp"
android:weightSum="1">
<TextView
android:layout_width="110dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Movie Name"
android:id="#+id/textView"
android:layout_marginLeft="30dp"
android:layout_marginTop="30dp"
/>
<TextView
android:layout_width="110dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Actor Name"
android:id="#+id/textView2"
android:layout_marginLeft="10dp"
android:layout_marginTop="30dp" />
<TextView
android:layout_width="100dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Grade"
android:id="#+id/textView3"
android:layout_marginLeft="20dp"
android:layout_marginTop="30dp" />
</LinearLayout>
</LinearLayout>
You have not mentioned orientation for the main parent LinearLayout so by default it is considering it to be horizontal and showing images and text views in same line.
The following LinearLayout is useless as it does not have any children.
You need to declare orientation of LinearLayout to be vertical to show image below your other layout.
Some pseudo code will be like,
<LinearLayout
orientation="vertical"
...>
<LinearLayout
orientation="horizontal"
...>
<TextViews ... />
</LinearLayout>
<ImageView ... />
</LinearLayout>
LinearLayout is a view group that aligns all children in a single direction, vertically or horizontally. You can specify the layout direction with the android:orientation attribute.
All children of a LinearLayout are stacked one after the other, so a vertical list will only have one child per row, no matter how wide they are, and a horizontal list will only be one row high (the height of the tallest child, plus padding). A LinearLayout respects margins between children and the gravity (right, center, or left alignment) of each child.
So My suggestion is Dont use specific width and Height, ALways use wrap_content or match_parent
For More Details see here
This is XML Code that You wants.
try the Below code. You should give the android:orientation="vertical"for the parent LinearLayout.
<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="match_parent"
android:layout_height="70dp"
android:orientation="horizontal"
android:weightSum="1">
<TextView
android:id="#+id/textView"
android:layout_width="110dp"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:layout_marginTop="30dp"
android:text="Movie Name"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView2"
android:layout_width="110dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="30dp"
android:text="Actor Name"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView3"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginTop="30dp"
android:text="Grade"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical" />
</LinearLayout>
Happy Coding :)
I have a relative layout with an ImageView in it and want to center the TextView in side the ImageView, in the activity layout xml file.
Here is the image view and then what I have tried for the TextView
This is inside of the relative layout:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="170dp"
android:minWidth="170dp"
android:id="#+id/logoBackground"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="33dp"
android:layout_marginStart="33dp"
android:layout_marginTop="33dp"
android:contentDescription="#string/content_description_useless"
android:background="#ffffd0cd" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/capital_u"
android:id="#+id/textView"
android:textSize="30sp"
android:layout_alignTop="#+id/logoBackground"
android:layout_alignLeft="#+id/logoBackground"
android:layout_alignStart="#+id/logoBackground"
android:layout_marginLeft="43dp"
android:layout_marginStart="43dp"
android:layout_marginTop="65dp"/>
It looks okay I think but the marginTop is 65 shouldn't it be half of the height of the imageView?
Thanks for the help in advance.
It's not working because you're telling the TextView to be in the center of the parent RelativeLayout, but the ImageView is attached to the top-left of the parent.
One approach would be to force the TextView to be the exact size of the ImageView using RelativeLayout's alignXyz properties. You then set the gravity attribute to center, and that makes the text appear in the center of the TextView's bounds. This should work as long as the ImageView is larger than the TextView in all dimensions.
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/capital_u"
android:id="#+id/textView"
android:textSize="30sp"
android:layout_alignTop="#+id/logoBackground"
android:layout_alignLeft="#+id/logoBackground"
android:layout_alignRight="#+id/logoBackground"
android:layout_alignBottom="#+id/logoBackground"
android:gravity="center"/>
Will that work for you?
One problem I see is this line:
android:layout_centerInParent="#+id/logoBackground"
The value of layout_centerInParent should be true or false. I'm guessing it is evaluating to false and is in the upper left corner. If you set it to true it will center itself in the middle of the parent (the relative layout). To center it in the ImageView you would need to have the relative layout the same size as the ImageView.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="170dp"
android:minWidth="170dp"
android:id="#+id/logoBackground"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="33dp"
android:layout_marginStart="33dp"
android:layout_marginTop="33dp"
android:contentDescription="#string/content_description_useless"
android:background="#ffffd0cd" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/capital_u"
android:id="#+id/textView"
android:textSize="30sp"
android:layout_centerInParent="true"/>
</RelativeLayout>
Try this to your textview : android:layout_centerInParent="true"
So that makes:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="170dp"
android:minWidth="170dp"
android:id="#+id/logoBackground"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="33dp"
android:layout_marginStart="33dp"
android:layout_marginTop="33dp"
android:contentDescription="#string/content_description_useless"
android:background="#ffffd0cd" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/capital_u"
android:id="#+id/textView"
android:textSize="30sp"
android:layout_alignTop="#+id/logoBackground"
android:layout_alignLeft="#+id/logoBackground"
android:layout_alignStart="#+id/logoBackground"
android:layout_marginLeft="43dp"
android:layout_marginStart="43dp"
android:layout_marginTop="65dp"
android:layout_centerInParent="true"/>
Try this code :
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center">
<ImageView
android:scaleType="centerCrop"
android:layout_width="30dp"
android:layout_height="30dp"/>
<TextView
android:id="#+id/your_text_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14sp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="1" />
</RelativeLayout>
For this purpose you have to use the Frame Layout.
For Reference, See here www.developer.android.com/reference/android/widget/FrameLayout.html
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:src="#drawable/ic_launcher"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
<TextView
android:text="Frame Text"
android:textSize="30px"
android:textStyle="bold"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:gravity="center"/>
</FrameLayout>