I am trying to implement data binding in a Fragment but it's not working, the same code is working in Activity.
Fragment class
final FragmentHomeBinding fragmentHomeBinding = DataBindingUtil.inflate(
inflater, R.layout.fragment_home, container, false);
homeViewModel = ViewModelProviders.of(this).get(HomeViewModel.class);
View root = inflater.inflate(R.layout.fragment_home, container, false);
fragmentHomeBinding.setVariable(BR.homeViewModel, homeViewModel);
HomeEventHandler homeEventHandler = new HomeEventHandler(getActivity());
fragmentHomeBinding.setHandler(homeEventHandler);
EventHandlerClass
HomeEventHandler(Context mContext) {
this.mContext = mContext;
}
public void onButtonClick(View view) {
Log.e("DB", "onButtonClick: ");
switch (view.getId()){
case R.id.frag_home_ll_stock:
Toast.makeText(mContext, "clicked", Toast.LENGTH_SHORT).show();
Intent intent = new Intent(mContext, StockCheckActivity.class);
mContext.startActivity(intent);
}
}
and finally the xml file
<data>
<import type="android.view.View" />
<variable
name="fragment"
type="com.poc.ui.home.HomeFragment"/>
<variable
name="handler"
type="com.poc.ui.home.HomeEventHandler"/>
</data>
<LinearLayout
android:onClick="#{view->handler.onButtonClick(view)}"
android:id="#+id/frag_home_ll_stock"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#color/grey_25"
android:clickable="true"
android:focusable="true"
android:gravity="center_horizontal"
android:orientation="vertical"
android:padding="16dp">
<!--
-->
<TextView
android:id="#+id/frag_home_tv_op4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:clickable="false"
android:text="#string/w_stock_check"
android:textColor="#color/black"
android:textSize="18sp" />
<ImageView
android:id="#+id/frag_home_iv_op4"
android:layout_width="72dp"
android:layout_height="72dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:clickable="false"
app:srcCompat="#drawable/ic_stock" />
</LinearLayout>
Remove the below line from your Fragment
View root = inflater.inflate(R.layout.fragment_home, container, false);
And If you need the view, you can pass with a parameter like below
android:onClick="#{(view) -> handler.onButtonClick(view)}"
Your LinearLayout should be like the following.
<LinearLayout
android:onClick="#{(view)->handler.onButtonClick(view)}"
android:id="#+id/frag_home_ll_stock"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#color/grey_25"
android:clickable="true"
android:focusable="true"
android:gravity="center_horizontal"
android:orientation="vertical"
android:padding="16dp">
<variable
name="HomeviewModel"
type="com.poc.ui.home.HomeviewModel"/> // exact path
you need to declare the viewmodel variable
android:onClick="#{(v) -> homeViewModel.buttonClicked(v, true)}"
if you are passing the parameter the function also should also contain same parameter
for e.g,
private void buttonClicked(View view, boolean value){
// your code
}
your method should look like this .
Try this one:
<ImageView
android:onClick="#{(view) -> handler.onButtonClick()}"
android:id="#+id/frag_home_iv_op3"
android:layout_width="72dp"
android:layout_height="72dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
app:srcCompat="#drawable/ic_report" />
Related
I am using PopupWindow with a custom view having 2 TextViews, I am trying to response against click event but click event is not triggering, following is the code that I am using
/* Get the binding object */
val binding: XYZBinding = XYZBinding.inflate(
LayoutInflater.from(applicationContext),
null,
false
)
binding.clickHandler = this
/* Set the popup menu window */
popupWindow = PopupWindow(binding.root)
popupWindow.contentView = LayoutInflater.from(applicationContext)
.inflate(R.layout.popup_menu_gang, null, false)
popupWindow.isTouchable = true
popupWindow.isFocusable = true
popupWindow.isOutsideTouchable = true
popupWindow.width = WindowManager.LayoutParams.WRAP_CONTENT
popupWindow.height = WindowManager.LayoutParams.WRAP_CONTENT
popupWindow.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
popupWindow.setOnDismissListener(PopupWindow.OnDismissListener {
window.attributes.alpha = alpha
window.addFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND)
window.decorView.invalidate()
})
popupWindow.showAsDropDown(binding.layoutHeader.imageViewMenu)
I have also tried a direct onClickListener but it doesn't work as well
binding.textViewGangPopupRenameButtons.setOnClickListener(View.OnClickListener {
Toast.makeText(applicationContext, "working", Toast.LENGTH_SHORT).show()
})
Following is the xml I am using
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<data>
<import type="xyz.BaseActivity" />
<variable
name="clickHandler"
type="BaseActivity" />
</data>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:layout_marginEnd="16dp"
app:cardCornerRadius="16dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textViewGangPopupDelete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:fontFamily="#font/montserrat_medium"
android:onClick="#{(view) -> clickHandler.onClick(view)}"
android:paddingStart="16dp"
android:paddingTop="16dp"
android:paddingEnd="16dp"
android:paddingBottom="8dp"
android:text="#string/delete"
android:textColor="#color/textColorBlue"
android:textSize="14sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textViewGangPopupRenameButtons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:fontFamily="#font/montserrat_medium"
android:onClick="#{(view) -> clickHandler.onClick(view)}"
android:paddingStart="16dp"
android:paddingTop="8dp"
android:paddingEnd="16dp"
android:paddingBottom="16dp"
android:text="#string/rename_buttons"
android:textColor="#color/textColorBlue"
android:textSize="14sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textViewGangPopupDelete" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</FrameLayout>
</layout>
Set the Id of Your Text View with the PopupView.. Like this
` val layoutInflater = activity!!
.getSystemService(AppCompatActivity.LAYOUT_INFLATER_SERVICE) as
LayoutInflater
val popupView: View =
layoutInflater.inflate(R.layout.custom_grid_bottomnav, null)
val popupWindow = PopupWindow(
popupView,
ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT
)
// popupWindow.dismiss()
val tx = popupView.findViewById<TextView>(R.id.text1) //change
tx.setOnClickListener(object : View.OnClickListener {
override fun onClick(v: View?) {
//Do what you want
}
}`
I've been search the entire internet or couple of hours, no luck
I'm trying to figure out how to pass in the MutableLiveData to a custom view
Here is the live data in the ViewModel for my activity data binding
var perStops: MutableLiveData<Int> = MutableLiveData(10)
Here is how I use the custom view in my activity
<com.abc.ui.widgets.NumberStepper
app:amount="#={data.perStops}"
app:min="0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"/>
This is the custom view for the number stepper
class NumberStepper(context: Context, attrs: AttributeSet) : RelativeLayout(context, attrs) {
private val rootView = LayoutInflater.from(context)
val binding = NumberPickerCustomLayoutBinding.inflate(rootView,this,true)
init {
val customAttributes = context.obtainStyledAttributes(attrs, R.styleable.NumberStepper)
val minAmount = customAttributes.getInteger(R.styleable.NumberStepper_min,0)
val amount = customAttributes.getInteger(R.styleable.NumberStepper_amount,0)
binding.suffix = customAttributes.getString(R.styleable.NumberStepper_suffix)?:""
binding.data = amount
}}
Here is the XML layout for NumberPickerCustomLayoutBinding
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<data>
<variable
name="data"
type="Integer" />
<variable
name="suffix"
type="String" />
</data>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:orientation="horizontal">
<ImageButton
android:id="#+id/decrement"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginEnd="-10dp"
android:background="#null"
android:padding="#dimen/odc_padding16"
android:src="#drawable/ic_minus" />
<TextView
android:id="#+id/display"
style="#style/TextAppearance.Secondary"
android:layout_width="45dp"
android:layout_height="match_parent"
android:background="#android:color/white"
android:gravity="center"
tools:text="1"
android:text='#{data.toString() + suffix}' />
<ImageButton
android:id="#+id/increment"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginStart="-10dp"
android:background="#null"
android:padding="#dimen/odc_padding16"
android:src="#drawable/ic_plus" />
</LinearLayout>
I have used two Fragment in my code. I have to display a custom ListView in each fragment. But I would like to handle Button's onClickListener event which is in this ListView.
I can't find online how to use these Button (ImageButton, actually) components in Fragment class.
Here is my code:
My fragment class:
public class tabtodo extends Fragment implements View.OnClickListener {
public tabtodo() {}
private View view, view2;
private ListView lstTask;
private ImageButton btndelete;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
view = inflater.inflate(R.layout.fragment_tabtodo, container, false);
lstTask = (ListView) view.findViewById(R.id.listView);
AlUpdater alUpdater = new AlUpdater(getContext());
lstTask.setAdapter(alUpdater.getAdapterTodo());
view2 = inflater.inflate(R.layout.row, container, false);
btndelete = (ImageButton) view2.findViewById(R.id.btntest);
btnTest.setOnClickListener(this);
return mView;
}
#Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.btntest:
Log.i("prova", "prova ");
break;
default:
Log.i("prova", "def");
break;
}
}
alUpdater.getAdapterTodo() is:
public ArrayAdapter < String > getAdapterTodo() {
ArrayList < String > taskList = (dG).getListTodo("todo");
if (adptodo == null) {
adptodo = new ArrayAdapter < > (context, R.layout.row, R.id.task_title, taskList);
adptodo.notifyDataSetChanged();
} else {
adptodo.clear();
adptodo.addAll(taskList);
adptodo.notifyDataSetChanged();
}
return adptodo;
}
as you can see, I am using a custom layout for the arrayadapter.
R.layout.fragment_tabtodo: is a fragment with just a listview:
<?xml version="1.0" encoding="utf-8"?>`
<FrameLayout 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:context=".tabtodo"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:background="#color/white">
<ListView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#color/white"
android:dividerHeight="0dp"
android:footerDividersEnabled="true"
android:headerDividersEnabled="true">
</ListView>
</FrameLayout>
and finally, the XML of the row of the adapter (**R.layout.row**):
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingVertical="8dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/themeselector">
<TextView
android:id="#+id/task_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_marginEnd="10dp"
android:text="TASK"
android:textColor="#color/white"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/btnGoToDone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="MissingConstraints" />
<ImageButton
android:id="#+id/btnGoToDone"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:backgroundTint="#android:color/transparent"
android:onClick="switchTodoDone"
android:src="#drawable/ic_done_icon"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/btndelete"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/btndelete"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:layout_marginEnd="4dp"
android:backgroundTint="#android:color/transparent"
android:src="#drawable/ic_delete_icon"
android:onClick="deleteTask"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
you need to create a custom adapter for you ListView. and handle the button click there.
check this tutorial here
I would recommend that you use RecyclerView instead of ListView since it enforces the ViewHolder pattern which improves the performance.
Using the following layouts and views below, I cannot get the EditText et_messageText box to show up in my display properly. If I run this in the emulator, I am able to click in the area and get a "null" selection cursor, so I know the EditText is there, but the keyboard never shows, and I am not able to get input to work. What am I doing wrong?
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<layout 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">
<data>
<variable
name="viewModel"
type="com.example.project.model.MyViewModel" />
</data>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.project.MainActivity">
<com.example.project.view.ChannelHeaderView
android:id="#+id/channelHeader"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" />
<com.example.project.view.MessageInputView
android:id="#+id/message_input"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" />
</RelativeLayout>
</layout>
message_input.xml
<?xml version="1.0" encoding="utf-8"?>
<layout 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">
<data>
<variable
name="viewModel"
type="com.example.project.model.MyViewMOdel" />
</data>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:focusable="true"
android:focusableInTouchMode="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/iv_send"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginEnd="10dp"
android:layout_marginBottom="13dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:srcCompat="#drawable/stream_ic_send" />
<EditText
android:id="#+id/et_messageText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="112dp"
android:ems="10"
android:inputType="text"
android:text="#={viewModel.inputText}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/iv_send"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
MessageInputView.java
public class MessageInputView extends RelativeLayout {
private MessageInputBinding binding;
private MyViewModel viewModel;
public MessageInputView(Context context) {
super(context);
binding = initBinding(context);
}
public MessageInputView(Context context, AttributeSet attrs) {
super(context, attrs);
binding = initBinding(context);
// Focus Listening
binding.etMessageText.setOnFocusChangeListener((v, hasFocus) -> {
if (hasFocus) {
binding.etMessageText.setTextIsSelectable(true);
InputMethodManager imm = (InputMethodManager) context.getSystemService(Context.INPUT_METHOD_SERVICE);
imm.showSoftInput(v,InputMethodManager.SHOW_FORCED);
}
});
}
private MessageInputBinding initBinding(Context context) {
LayoutInflater inflater = LayoutInflater.from(context);
binding = MessageInputBinding.inflate(inflater, this, true);
binding.etMessageText.clearFocus();
return binding;
}
public void setViewModel(MyViewMOdel model, LifecycleOwner lifecycleOwner) {
this.viewModel = model;
binding.setLifecycleOwner(lifecycleOwner);
binding.setViewModel(viewModel);
}
}
and finally in the onCreate() of
MainActivity.java
binding = DataBindingUtil.setContentView(this, R.layout.activity_main);
binding.setLifecycleOwner(this);
viewModel = ViewModelProviders.of(this).get(MyViewModel.class);
viewModel.setPreferences(this);
binding.setViewModel(viewModel);
binding.channelHeader.setViewModel(viewModel, this);
binding.messageInput.setViewModel(viewModel, this);
Why are you extending your MessageInputView class with RelativeLayout?
I guess that your MessageInputView class is a Fragment so extend it with Fragment and use the default LayoutInflater inflater and ViewGroup container.
Hence your:
private MessageInputBinding initBinding(Context context) {
LayoutInflater inflater = LayoutInflater.from(context);
binding = MessageInputBinding.inflate(inflater, this, true);
binding.etMessageText.clearFocus();
return binding;
}
Should be like this:
private MessageInputBinding initBinding(LayoutInflater inflater, ViewGroup container) {
binding = DataBindingUtil.inflate(inflater, R.layout.message_input, container, false);
binding.etMessageText.clearFocus();
return binding;
}
I was playing around with the Shared Element Transition and developed a testapp with 4 Fragments.
In the picture you can see, the first Fragment contains a "start now" message, when it's clicked I want to replace the container with the Fragment in the middle. As an eye candy I want an Animation by using Shared Element Transitions.
Problem
My Problem is, if I leave the first Fragment empty (without starting message) and I for example set the OnClickListener to the Icon itself, everything is working alright with a nice animation. But if the first Fragment has that message in it only the first Icon (the second Fragment, picture in mid) doesn't have an animation anymore. It's just replacing the first fragment. The curios thing is, if I change my OnClickListener and let it start the second page (right picture) the animation is working fine again. So only the first/left Icon does not provide an animation though all Methods and XML are mostly 1:1 the same.
As I couldn't develope a better solution, each "toolbar" is designed in the Fragment itself.
Main Activity
public class FirstStartupActivity extends AppCompatActivity {
#Override
protected void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_firststartup);
doFragmentTransaction(new MainFragment(), "TAG", false, null);
}
public void doFragmentTransaction(Fragment fragment, String tag, boolean addToBackStack, List<View> sharedElements){
FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
transaction.replace(R.id.ActivityFirstStartup_fragmentContainer, fragment, tag);
if(addToBackStack){
transaction.addToBackStack(tag);
}
if( sharedElements != null && !sharedElements.isEmpty()){
for(int i = 0; i < sharedElements.size(); i++){
View view = sharedElements.get(i);
transaction.addSharedElement(view, view.getTransitionName());
}
}
transaction.commit();
}}
First Fragment with Message
public class MainFragment extends Fragment {
#Nullable
#Override
public View onCreateView(#NonNull LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_firststartup_home, container, false);
View view = v.findViewById(R.id.relLayoutPageOne);
final List<View> listview = new ArrayList<>();
listview.add(view);
View view2 = v.findViewById(R.id.relLayoutPageTwo);
final List<View> listview2 = new ArrayList<>();
listview2.add(view2);
Button button = v.findViewById(R.id.buttonStart);
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
((FirstStartupActivity)getActivity()).doFragmentTransaction(new UsernameFragment(), "test", true, listview);
//((FirstStartupActivity)getActivity()).doFragmentTransaction(new CameraFragment(), "TEST2", true, listview2);
}
});
RelativeLayout rel2 = v.findViewById(R.id.relLayoutPageTwo);
rel2.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
((FirstStartupActivity)getActivity()).doFragmentTransaction(new CameraFragment(), "TEST2", true, listview2);
}
});
return v;
}}
Second Fragment No Animation
public class UsernameFragment extends Fragment {
#Nullable
#Override
public View onCreateView(#NonNull LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_firststartup_pgone, container, false);
postponeEnterTransition();
return v;
}
#Override
public void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP){
setSharedElementEnterTransition(TransitionInflater.from(getContext()).inflateTransition(android.R.transition.move));
}
}}
Third Fragment Working
public class CameraFragment extends Fragment {
#Nullable
#Override
public View onCreateView(#NonNull LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_firststartup_pgtwo, container, false);
return v;
}
#Override
public void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP){
setSharedElementEnterTransition(TransitionInflater.from(getContext()).inflateTransition(android.R.transition.move));
}
}}
Second Fragment (Picture in middle) No Animation when replacing)
<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">
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout2"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#drawable/draw_login_edittext">
</android.support.constraint.ConstraintLayout>
<RelativeLayout
android:id="#+id/relLayoutPageTwo"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginTop="4dp"
android:background="#drawable/draw_login_edittext_rounded"
android:transitionName="ProfileCam"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:transitionName="ProfileCam"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
app:srcCompat="#mipmap/testtwo" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relLayoutPageThree"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:background="#drawable/draw_login_edittext_rounded"
android:transitionName="ProfileGender"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.95"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
app:srcCompat="#mipmap/testthree" />
</RelativeLayout>
<RelativeLayout
android:transitionName="ProfilePic"
android:layout_width="273dp"
android:layout_height="210dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:background="#drawable/draw_login_edittext_rounded"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout2">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
app:srcCompat="#mipmap/test" />
</RelativeLayout>
First Fragment (Picture left)
<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">
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout2"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#a8655c">
</android.support.constraint.ConstraintLayout>
<RelativeLayout
android:transitionName="ProfilePic"
android:id="#+id/relLayoutPageOne"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:background="#drawable/draw_login_edittext_rounded"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.049"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
app:srcCompat="#mipmap/test" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relLayoutPageTwo"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:background="#drawable/draw_login_edittext_rounded"
android:transitionName="ProfileCam"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
app:srcCompat="#mipmap/testtwo" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relLayoutPageThree"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:background="#drawable/draw_login_edittext_rounded"
android:transitionName="ProfileGender"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.95"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
app:srcCompat="#mipmap/testthree" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:forceHasOverlappingRendering="true"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:background="#drawable/draw_login_edittext_rounded"
android:padding="25dp"
android:transitionName="ProfilePic"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout2">
<TextView
android:id="#+id/text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:text="Bevor du loslegen könnst benötigen wir noch kurz ein paar Informationen über dich! :)"
android:textAlignment="center"
android:textColor="#BFFFFFFF" />
<Button
android:id="#+id/buttonStart"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/text"
android:layout_centerHorizontal="true"
android:layout_marginHorizontal="15dp"
android:layout_marginTop="15dp"
android:background="#drawable/draw_rounded_edittext_dark"
android:text="Start now"
android:textColor="#BFFFFFFF" />
</RelativeLayout>
Third Fragment (right Picture) Animation when replacing
<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">
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout2"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#drawable/draw_login_edittext">
</android.support.constraint.ConstraintLayout>
<RelativeLayout
android:id="#+id/relLayoutPageOne"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:background="#drawable/draw_login_edittext_rounded"
android:transitionName="ProfilePic"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.049"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
app:srcCompat="#mipmap/test" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relLayoutPageThree"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:background="#drawable/draw_login_edittext_rounded"
android:transitionName="ProfileGender"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.95"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
app:srcCompat="#mipmap/testthree" />
</RelativeLayout>
<RelativeLayout
android:layout_width="273dp"
android:layout_height="210dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:background="#c8c8c8"
android:transitionName="ProfileCam"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/constraintLayout2">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
app:srcCompat="#mipmap/testtwo" />
</RelativeLayout>
Visual Description
First Icon doesn't work but the second one works like charm
For some Reason the first GIF is way too fast, its popping up normally the only Problem is the missing Animation
Well I tried to change some things and I made everything worse. Then I "repaired" it and now it works, unfortunetly I can't show you a solution for that. I try to work through the codes again
EDIT: #LieForBanana had the solution but I understood him wrong, indeed my first Fragment also had the Transition Name it (3x TransitionName ProfilePic). I am ashamed, it was just one silly mistake