场景。在视图下滑动过渡
Scene. Slide transition under views
看样本。我有两个场景,分别是开始和结束场景。
起始场景布局:
<?xml version="1.0" encoding="utf-8"?>
<merge
android:id="@+id/vgRoot"
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"
tools:parentTag="RelativeLayout"
tools:ignore="HardcodedText"
>
<Button
android:id="@+id/btn1"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/cardView"
android:text="Button"
android:layout_centerHorizontal="true"
/>
<Button
android:id="@+id/btnGo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/btn1"
android:text="@string/go"
android:layout_centerHorizontal="true"
/>
<android.support.v7.widget.CardView
android:id="@+id/cardView"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_margin="16dp"
android:translationZ="3dp"
>
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#3829AB"
android:padding="32dp"
>
<TextView
android:id="@+id/tvText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text Title"
android:textAppearance="?android:textAppearanceMedium"
android:textColor="@android:color/white"
/>
</FrameLayout>
</android.support.v7.widget.CardView>
</merge>
我有 btn1
应用了滑动过渡,cardView
和 container
,它们改变了它的边界和 tvText
作为 [=19= 的主体].
以及结尾场景:
<?xml version="1.0" encoding="utf-8"?>
<merge
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:ignore="HardcodedText"
tools:parentTag="RelativeLayout"
>
<android.support.v7.widget.CardView
android:id="@+id/cardView"
android:layout_height="wrap_content"
android:layout_width="match_parent"
app:cardCornerRadius="0dp"
>
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp"
android:background="#3829AB"
android:orientation="vertical"
>
<TextView
android:id="@+id/tvText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text Title"
android:textAppearance="?android:textAppearanceMedium"
android:textColor="@android:color/white"
/>
</FrameLayout>
</android.support.v7.widget.CardView>
</merge>
带转换的片段代码:
public class FragmentStartTransition extends Fragment {
@BindView(R.id.btnGo) View btnGo;
@BindView(R.id.vgRoot) ViewGroup vgRoot;
private Unbinder unbinder;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
ViewGroup view = (ViewGroup) inflater.inflate(R.layout.fragment_start_transition, container, false);
unbinder = bind(this, view);
return view;
}
@Override
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
btnGo.setOnClickListener(btnGo.setOnClickListener(v -> moveNext());
}
@Override
public void onDestroyView() {
super.onDestroyView();
unbinder.unbind();
}
private void moveNext() {
Scene scene = Scene.getSceneForLayout(vgRoot, R.layout.scene_end, getContext());
TransitionManager.go(scene, getTransition());
}
private Transition getTransition() {
Slide slide = new Slide(Gravity.TOP);
slide.addTarget(R.id.btn1);
ChangeBounds changeBounds = new ChangeBounds();
changeBounds.addTarget(R.id.cardView);
changeBounds.addTarget(R.id.container);
changeBounds.addTarget(R.id.tvText);
return new TransitionSet()
.setOrdering(TransitionSet.ORDERING_TOGETHER)
.addTransition(slide)
.addTransition(changeBounds)
.setDuration(1500);
}
}
fragment_start_transition:
<RelativeLayout
android:id="@+id/vgRoot"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="HardcodedText"
>
<include layout="@layout/scene_start"/>
</RelativeLayout>
结果动画:
我想将 btn1 滑到 cardView
和 container
下。如您所见,cardView
被放置在根布局的末尾以位于按钮上方。但在结果动画中,它滑过 cardView
。我能以某种方式控制动画视图之间的这种 z 轴关系吗?
试过cardView.bringToFront()
- 没用
肯定有简单的解决方案,但我找不到。
伙计们,我需要你们的帮助。
更新:
这是因为framework在scene container view overlay上绘制了slide transition,看android.transition.Visibility
class:
sceneRoot.getOverlay().add(overlayView);
但问题还是悬而未决。
我刚刚解决了同样的问题。诀窍似乎是不让 Visibility
class 将滑动(消失)视图复制到场景根的覆盖层,这显然会显示在场景中任何其他视图之上。
滑动视图仅在实际从视图层次结构中删除时才复制到叠加层。如果我将视图留在场景中,但将其 visibility
设置为 GONE
,它会重新使用相同的视图,而不是将其复制到叠加层。然后它将滑到其兄弟视图下方(如果它在它们下方)(因此您的 cardView.bringToFront()
应该可以工作)。
看样本。我有两个场景,分别是开始和结束场景。 起始场景布局:
<?xml version="1.0" encoding="utf-8"?>
<merge
android:id="@+id/vgRoot"
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"
tools:parentTag="RelativeLayout"
tools:ignore="HardcodedText"
>
<Button
android:id="@+id/btn1"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/cardView"
android:text="Button"
android:layout_centerHorizontal="true"
/>
<Button
android:id="@+id/btnGo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/btn1"
android:text="@string/go"
android:layout_centerHorizontal="true"
/>
<android.support.v7.widget.CardView
android:id="@+id/cardView"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_margin="16dp"
android:translationZ="3dp"
>
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#3829AB"
android:padding="32dp"
>
<TextView
android:id="@+id/tvText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text Title"
android:textAppearance="?android:textAppearanceMedium"
android:textColor="@android:color/white"
/>
</FrameLayout>
</android.support.v7.widget.CardView>
</merge>
我有 btn1
应用了滑动过渡,cardView
和 container
,它们改变了它的边界和 tvText
作为 [=19= 的主体].
以及结尾场景:
<?xml version="1.0" encoding="utf-8"?>
<merge
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:ignore="HardcodedText"
tools:parentTag="RelativeLayout"
>
<android.support.v7.widget.CardView
android:id="@+id/cardView"
android:layout_height="wrap_content"
android:layout_width="match_parent"
app:cardCornerRadius="0dp"
>
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp"
android:background="#3829AB"
android:orientation="vertical"
>
<TextView
android:id="@+id/tvText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text Title"
android:textAppearance="?android:textAppearanceMedium"
android:textColor="@android:color/white"
/>
</FrameLayout>
</android.support.v7.widget.CardView>
</merge>
带转换的片段代码:
public class FragmentStartTransition extends Fragment {
@BindView(R.id.btnGo) View btnGo;
@BindView(R.id.vgRoot) ViewGroup vgRoot;
private Unbinder unbinder;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
ViewGroup view = (ViewGroup) inflater.inflate(R.layout.fragment_start_transition, container, false);
unbinder = bind(this, view);
return view;
}
@Override
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
btnGo.setOnClickListener(btnGo.setOnClickListener(v -> moveNext());
}
@Override
public void onDestroyView() {
super.onDestroyView();
unbinder.unbind();
}
private void moveNext() {
Scene scene = Scene.getSceneForLayout(vgRoot, R.layout.scene_end, getContext());
TransitionManager.go(scene, getTransition());
}
private Transition getTransition() {
Slide slide = new Slide(Gravity.TOP);
slide.addTarget(R.id.btn1);
ChangeBounds changeBounds = new ChangeBounds();
changeBounds.addTarget(R.id.cardView);
changeBounds.addTarget(R.id.container);
changeBounds.addTarget(R.id.tvText);
return new TransitionSet()
.setOrdering(TransitionSet.ORDERING_TOGETHER)
.addTransition(slide)
.addTransition(changeBounds)
.setDuration(1500);
}
}
fragment_start_transition:
<RelativeLayout
android:id="@+id/vgRoot"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="HardcodedText"
>
<include layout="@layout/scene_start"/>
</RelativeLayout>
结果动画:
我想将 btn1 滑到 cardView
和 container
下。如您所见,cardView
被放置在根布局的末尾以位于按钮上方。但在结果动画中,它滑过 cardView
。我能以某种方式控制动画视图之间的这种 z 轴关系吗?
试过cardView.bringToFront()
- 没用
肯定有简单的解决方案,但我找不到。
伙计们,我需要你们的帮助。
更新:
这是因为framework在scene container view overlay上绘制了slide transition,看android.transition.Visibility
class:
sceneRoot.getOverlay().add(overlayView);
但问题还是悬而未决。
我刚刚解决了同样的问题。诀窍似乎是不让 Visibility
class 将滑动(消失)视图复制到场景根的覆盖层,这显然会显示在场景中任何其他视图之上。
滑动视图仅在实际从视图层次结构中删除时才复制到叠加层。如果我将视图留在场景中,但将其 visibility
设置为 GONE
,它会重新使用相同的视图,而不是将其复制到叠加层。然后它将滑到其兄弟视图下方(如果它在它们下方)(因此您的 cardView.bringToFront()
应该可以工作)。