Shadows seem to cut off on some of my CardView usages.
Any idea why? looks like removing the padding on the parent resolves the issue, but I do want the padding. And I don't want to use margin on the inner card, because there are other views aligned and I prefer having the padding set on the parent to apply to all children
Any solutions?
layout
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
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:layout_marginTop="#dimen/standard_spacing"
android:layout_marginLeft="#dimen/standard_spacing"
android:layout_marginRight="#dimen/standard_spacing"
android:layout_marginBottom="#dimen/smaller_spacing"
app:cardCornerRadius="#dimen/standard_card_corner_radius"
app:cardElevation="10dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="#dimen/standard_spacing">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardBackgroundColor="#color/light_gray_background"
android:minHeight="40dp"
app:cardElevation="5dp"
app:cardCornerRadius="#dimen/standard_card_corner_radius" >
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
add
android:clipToPadding="false"
to LinearLayout
Related
how to remove the default black shadow (black shadow or each corners) in ListItemPresenter,
attaching image of presenter view
here is xml of the item presenter:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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:background="#android:color/transparent"
app:cardCornerRadius="16dp"
android:layout_width="200dp"
android:layout_height="200dp">
<androidx.cardview.widget.CardView
android:background="#android:color/transparent"
app:cardCornerRadius="8dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="8dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/block_bg_state"
android:gravity="center"
android:orientation="vertical">
...
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
If you don't want a shadow, then you don't need to use a CardView. It's meant as a "wrapper" to add elevation (a shadow) and rounded corners to the view it holds.
If this is your complete layout, you can also remove the LinearLayout and add the layout width/height directly to your ConstraintLayout.
I have a LinearLayout with deferents views, and it displays normally when install it in my phone. But I want to put that LinearLayout into a ContraintLayout, however when I did it, nothing is display in my screen.
This code works well
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto">
<data>
</data>
<LinearLayout
android:id="#+id/bottomMenu"
android:layout_width="match_parent"
android:layout_height="#dimen/short_cuts_bottom_menu_layout_height"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<!-- Views -->
</LinearLayout>
</layout>
But this doesn't works
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto">
<data>
</data>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/bottomMenu"
android:layout_width="match_parent"
android:layout_height="#dimen/short_cuts_bottom_menu_layout_height"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<!-- Views -->
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
And I just put my LinearLayout into a ConstraintLayout
Someone knows why this happens?
The android:layout_width attribute in ConstraintLayout should have the value match_parent because the LinearLayout inside it has the same
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
By assigning wrap_content to the width of your ConstraintLayout, you tell it to define its dimension based on the dimensions of its children. And by assigning match_parent to the width of your LinearLayout you tell it to define its dimension based on its parent. So they keep asking each other, nobody knows :)
You can simply assign match_parent to the width of your constraint layout
I have a parent ConstraintLayout in my fragment.xml:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="400dp"
android:maxHeight="400dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/colorPopupBackground"
android:fadeScrollbars="false"
android:id="#+id/profile_layout"
android:elevation="1dp">
as you can see i've set a maxHeight and constrained it on every side - so you would think it should centre vertically on the screen. However the ConstraintLayout sits on the top vertically.
Any idea?
Just remove bottom constraint because when you set both side constraint and set custom width then it will be center of both constraint, SO update your code like bellow
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="400dp"
android:maxHeight="400dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/colorPopupBackground"
android:fadeScrollbars="false"
android:id="#+id/profile_layout"
android:elevation="1dp">
I've two fragments inside an activity.xml but the width is not 50% for each.
I believe following are the properties to make them work, please advise if not.
layout_weight="1"
layout_width="0dp"
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<fragment
android:id="#+id/ListFragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:layout="#layout/list_fragment" />
<fragment
android:id="#+id/FormFragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
app:layout_constraintEnd_toStartOf="#+id/ListFragment"
app:layout_constraintTop_toTopOf="parent"
tools:layout="#layout/form_fragment" />
</android.support.constraint.ConstraintLayout>
Use a LinearLayout rather than a ConstraintLayout.
https://developer.android.com/guide/topics/ui/layout/linear#Weight
Or use layout_constraintHorizontal_weight
https://developer.android.com/training/constraint-layout/index.html#constrain-chain
The parent layout for these fragments is ConstraintLayout and layoutWeight attribute does not work with that. if you want to divide the layout using this attribute the only thing you need to do is to change constraintLayout to LinearLayout.
I wanted a cardview similar to this:
I wanted my CardView separated like that. The problem is, I don't know how to make CardView go edge to edge or match the width of the CardView to its parent. If I put shadows or setting the elevation at 4dp/8dp, the entire CardView adjusts to show the shadows on both end. Which is not what I want. This is worse when viewed on pre-lollipop.
I am believing this is just thick line separating it which can be done creating custom view with a custom drawable. But can this be done with just CardViews? I need my CardViews to go to the most edge and show separation at the bottom.
Here is my current layout. I created a separate layout file for each CardViews and included them in my fragment like this:
<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:fillViewport="false"
android:fitsSystemWindows="true"
tools:context="com.neonwarge.android.notifire.activity.TaskActivity"
android:orientation="vertical">
<include
layout="#layout/cardview1"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<include
layout="#layout/cardview2"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
....
</LinearLayout>
And here is what generally a CardView looks like:
<?xml version="1.0" encoding="utf-8"?>
<merge
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="4dp"
app:cardElevation="4dp"
app:cardUseCompatPadding="true"
app:cardPreventCornerOverlap="false">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingStart="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingEnd="#dimen/activity_horizontal_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
android:layout_marginTop="#dimen/activity_vertical_margin">
...
</RelativeLayout>
</android.support.v7.widget.CardView>
</merge>