I'm confused about how transitionSet is used. This is my definition:
<?xml version="1.0" encoding="utf-8"?>
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android" android:transitionOrdering="sequential">
<slide android:slideEdge="bottom" android:startDelay="0">
<targets>
<target android:targetId="@id/action_save" />
</targets>
</slide>
<slide android:slideEdge="top">
<targets>
<target android:targetId="@id/image_album_background" />
</targets>
</slide>
<slide
android:duration="500"
android:slideEdge="bottom">
<targets>
<target android:targetId="@id/fields_container" />
</targets>
</slide>
</transitionSet>
This way, all views will slide from bottom edge. But if I change the order into this:
<?xml version="1.0" encoding="utf-8"?>
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android" android:transitionOrdering="sequential">
<slide android:slideEdge="top">
<targets>
<target android:targetId="@id/image_album_background" />
</targets>
</slide>
<slide android:slideEdge="bottom" android:startDelay="0">
<targets>
<target android:targetId="@id/action_save" />
</targets>
</slide>
<slide
android:duration="500"
android:slideEdge="bottom">
<targets>
<target android:targetId="@id/fields_container" />
</targets>
</slide>
</transitionSet>
Then, all will slide from top edge.
It seems that Android only cares about the first transition.
Update: This is the layout:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fab="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<!-- Picture -->
<RelativeLayout
android:id="@+id/image_album_background"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff000000">
<ImageView
android:id="@+id/image_album"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:adjustViewBounds="true"
android:contentDescription="No art"
android:maxHeight="320dp"
android:maxWidth="320dp"
android:src="@drawable/ic_noart"
android:transitionName="transition_album_cover"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/btn_img_marker"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignEnd="@+id/image_album"
android:layout_alignParentBottom="true"
android:layout_alignRight="@+id/image_album"
android:background="#ff56bb21" />
</RelativeLayout>
<LinearLayout
android:id="@+id/fields_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/image_album_background"
android:background="#ffffffff"
android:orientation="vertical"
android:padding="@dimen/frame_margin">
<CheckBox
android:id="@+id/cb_embed_art"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="@string/label_embed_art" />
<TextView
android:id="@+id/text_filepath"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="/mnt/data/path/to/file/audio.mp3" />
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/fields_container"
android:background="#ffffffff"
android:padding="24dp">
<!-- Title -->
<LinearLayout
android:id="@+id/title_row"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
style="@style/label"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="@string/label_title" />
<EditText
android:id="@+id/edit_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:inputType="text" />
</LinearLayout>
<!-- Artist -->
<LinearLayout
android:id="@+id/artist_row"
style="@style/input_row"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/title_row"
android:orientation="horizontal">
<TextView
style="@style/label"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="@string/label_artist" />
<AutoCompleteTextView
android:id="@+id/edit_artist"
style="?android:editTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text" />
</LinearLayout>
<!-- Album artist -->
<LinearLayout
android:id="@+id/album_artist_row"
style="@style/input_row"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/artist_row"
android:orientation="horizontal">
<TextView
style="@style/label"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="@string/label_album_artist" />
<AutoCompleteTextView
android:id="@+id/edit_album_artist"
style="?android:editTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text" />
</LinearLayout>
<!-- Album -->
<LinearLayout
android:id="@+id/album_row"
style="@style/input_row"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/album_artist_row"
android:orientation="horizontal">
<TextView
style="@style/label"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="@string/label_album" />
<AutoCompleteTextView
android:id="@+id/edit_album"
style="?android:editTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text" />
</LinearLayout>
<LinearLayout
android:id="@+id/two_column_row1"
style="@style/input_row"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/album_row"
android:baselineAligned="false"
android:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
style="@style/label"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="@string/label_genre" />
<AutoCompleteTextView
android:id="@+id/edit_genre"
style="?android:editTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text" />
</LinearLayout>
<LinearLayout
style="@style/input_row"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
style="@style/label"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="@string/label_year" />
<EditText
android:id="@+id/edit_year"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="number" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="24dp"
android:layout_weight="3"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
style="@style/label"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="@string/label_track_no" />
<EditText
android:id="@+id/edit_track_no"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="number" />
</LinearLayout>
<LinearLayout
style="@style/input_row"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
style="@style/label"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="@string/label_track_total" />
<EditText
android:id="@+id/edit_track_total"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="number" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
style="@style/input_row"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/two_column_row1"
android:orientation="horizontal">
<TextView
style="@style/label"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="@string/label_comment" />
<EditText
android:id="@+id/edit_comment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="top"
android:inputType="textMultiLine"
android:minLines="5" />
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
</ScrollView>
<com.melnykov.fab.FloatingActionButton
android:id="@+id/action_save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_margin="16dp"
android:src="@drawable/ic_action_save"
fab:fab_colorNormal="@color/accent_shade"
fab:fab_colorRipple="#66FF9800" />
</FrameLayout>
This is how to open the layout:
String transitionName = "transition_album_cover";
if (AnimationViews.albumCover != null) {
fragmentTx.addSharedElement(AnimationViews.albumCover, transitionName);
}
TransitionInflater inflater = TransitionInflater.from(this);
editorFragment.setEnterTransition(inflater.inflateTransition(R.transition.editor_fragment_enter));
It is tricky to be able to make work all transitions which are child views. Because it depends on ViewGroup (parent view) of that child views.
Quoting from jimulabs:
- If the background of a
ViewGroupis set (even if it’sandroid:color/transparent), the transition system will treat theViewGroupas a single view and ignore its children. Thus, any transitions will only run on theViewGroup, instead of its children individually; if a transition has its target set to one of the children only, the transition will not run at all.- Conversely, if a
ViewGroupdoes not have a background (or it’s@null), transitions will run for all its individual children; if a transition has its target set to theViewGroup, the transition will not run at all.- This does NOT happen if you run
beginDelayedTransition()in normal cases such as setting the visibility of views in aOnClickListener.
You can also read about this from here on section Transitioning Views & Transition Groups.
However, you should be able to make it work through method ViewGroup#setTransitionGroup(boolean) which i could not make it work. I have tried using this method on parent layout of screen. So i had to stick with javacode for all transitionSet targets which is time consuming.
I just tried this and it works fine for me, so I have to think that it has to do with your specific targets. My guess is that image_album_background contains both action_save and fields_container. If so, those two Views are still going to slide within their container.
The easy way around this is to move the image_album_background into a sibling of other two instead of parent. If you don't already have a container that is capable of that (e.g. LinearLayout), one extra level will do it:
<FrameLayout ...>
<ImageView android:id="@+id/image_album_background"/>
<other views.../>
</FrameLayout>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With