Android 使用textswitcher切换文本时删除边距
我正在使用文本切换器来设置文本更改的动画。文本更改时,我正在使用向上滑动动画。但是,文本不会向上滑动到容器中。请看下面发布的视频。文本既不是从红色边框滑入,也不是滑出到红色顺序。如何实现文本从红色边框滑入并滑出到红色边框的行为 布局如下所示:Android 使用textswitcher切换文本时删除边距,android,android-layout,textview,android-animation,textswitcher,Android,Android Layout,Textview,Android Animation,Textswitcher,我正在使用文本切换器来设置文本更改的动画。文本更改时,我正在使用向上滑动动画。但是,文本不会向上滑动到容器中。请看下面发布的视频。文本既不是从红色边框滑入,也不是滑出到红色顺序。如何实现文本从红色边框滑入并滑出到红色边框的行为 布局如下所示: <?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schema
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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="wrap_content"
android:layout_gravity="top">
<androidx.cardview.widget.CardView
android:id="@+id/iv_background"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
app:cardCornerRadius="20dp"
app:cardElevation="0dp"
app:cardPreventCornerOverlap="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.imageview.ShapeableImageView
android:id="@+id/iv_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
app:shapeAppearance="@style/ContainerShape" />
<View
android:id="@+id/border"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/border" />
</androidx.cardview.widget.CardView>
<TextSwitcher
android:id="@+id/tv_textswitcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:inAnimation="@anim/slide_up_from_bottom"
android:outAnimation="@anim/slide_up_to_top"
android:visibility="visible"
app:layout_constrainedWidth="true"
app:layout_constraintBottom_toBottomOf="@+id/iv_background"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="@+id/iv_background"
app:layout_constraintTop_toTopOf="@+id/iv_background"
app:layout_constraintVertical_bias="1.0">
<TextView
android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/text_background"
android:ellipsize="end"
android:lineHeight="20dp"
android:text="Text 1"
android:paddingStart="12dp"
android:paddingTop="8dp"
android:paddingEnd="12dp"
android:paddingBottom="8dp"
android:textSize="14sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/text_background"
android:ellipsize="end"
android:lineHeight="20dp"
android:paddingStart="12dp"
android:paddingTop="8dp"
android:paddingEnd="12dp"
android:paddingBottom="8dp"
android:textSize="14sp" />
</TextSwitcher>
</androidx.constraintlayout.widget.ConstraintLayout>
动画文件:
从\u bottom.xml向上滑动\u
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="1000"
android:fromYDelta="100%"
android:toYDelta="0" />
</set>
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="1000"
android:fromYDelta="100%p"
android:toYDelta="0" />
</set>
向上滑动到\u top.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromYDelta="0"
android:toYDelta="-100%" />
</set>
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromYDelta="0"
android:toYDelta="-100%p" />
</set>
text_background.xml
<shape android:shape="rectangle">
<corners android:radius="18dp" />
<solid android:color="#e8e8e8" />
</shape>
尽管CardView和TextSwitcher被限制在完全相同的位置,但它们的大小不同。由于设置了边距,文本切换器的高度(和宽度)较小
解决方案是从TextSwitcher中删除边距,并将其设置为TextView。如果这覆盖了红色边框,您应该将TextSwitcher的背景设置为透明。实际上,这里有多个问题需要解决
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="1000"
android:fromYDelta="100%"
android:toYDelta="0" />
</set>
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="1000"
android:fromYDelta="100%p"
android:toYDelta="0" />
</set>
向上滑动到\u top.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromYDelta="0"
android:toYDelta="-100%" />
</set>
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromYDelta="0"
android:toYDelta="-100%p" />
</set>
现在,完整的布局如下所示:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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="wrap_content"
android:layout_gravity="top">
<androidx.cardview.widget.CardView
android:id="@+id/iv_background"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
app:cardCornerRadius="20dp"
app:cardElevation="0dp"
app:cardPreventCornerOverlap="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.imageview.ShapeableImageView
android:id="@+id/iv_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
app:shapeAppearance="@style/ContainerShape" />
</androidx.cardview.widget.CardView>
<TextSwitcher
android:id="@+id/tv_textswitcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@android:color/transparent"
android:inAnimation="@anim/slide_up_from_bottom"
android:outAnimation="@anim/slide_up_to_top"
android:visibility="visible"
app:layout_constrainedWidth="true"
app:layout_constraintBottom_toBottomOf="@+id/iv_background"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="@+id/iv_background"
app:layout_constraintTop_toTopOf="@+id/iv_background"
app:layout_constraintVertical_bias="1.0">
<TextView
android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:background="@drawable/text_background"
android:ellipsize="end"
android:lineHeight="20dp"
android:paddingStart="12dp"
android:paddingTop="8dp"
android:paddingEnd="12dp"
android:paddingBottom="8dp"
android:text="Text 1"
android:textSize="14sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:background="@drawable/text_background"
android:ellipsize="end"
android:lineHeight="20dp"
android:paddingStart="12dp"
android:paddingTop="8dp"
android:paddingEnd="12dp"
android:paddingBottom="8dp"
android:textSize="14sp" />
</TextSwitcher>
<View
android:id="@+id/border"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/border"
app:layout_constraintBottom_toBottomOf="@+id/iv_background"
app:layout_constraintEnd_toEndOf="@+id/iv_background"
app:layout_constraintStart_toStartOf="@+id/iv_background"
app:layout_constraintTop_toTopOf="@+id/iv_background" />
</androidx.constraintlayout.widget.ConstraintLayout>
从textswitcher中删除边距并将其添加到TextView并不能解决此问题。然而,有一个明显的变化。文本视图现在在向上或向下滑动时与红色边框重叠。你能不能将它从-100%移动到delta-200%?这样更好,但还不够好。我还添加了淡出/生效。问题是文本向上滑动时会越过红色边框。仍然不会从红色边框滑入,也不会滑出到红色边框。它正在越过红色边界。这是我的布局问题。红色边框的translationZ低于textview的translationZ。这意味着问题现在已经完全解决了?