How to make 2 layouts sliding on button click in xamarin/android? - xamarin.android

Question

I'm begining with xamarin and android, and I'm not sure to understand the good way to do.
Then I created a main activity and a second activity with their respective layouts.
In the first I put a button with that code:
button.Click += (sender, e) =>
{
var intent = new Android.Content.Intent(this, typeof(Activity1));
StartActivity(intent);
OverridePendingTransition(Android.Resource.Animation.SlideInleft, Android.Resource.Animation.SlideInleft);
};
And in the second:
button.Click += (sender, e) =>
{
Finish();
};
But this doesn't do what I want, I would like the two layouts two slide as if there were side by side, but here the second layout just slides on the first. Also it comes from the left were I would like it to come from the right and there's no SlideInright.
Also is it the right way to do using two activities, mustn't I have only one activity and two layouts (views?).

Answer 1

First, you could use one activity which contains two ViewGroup. As for your question, you can use Animation and FrameLayout which contains two RelativeLayout to complete what you want, like this:
MainActivity.axml:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:a="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/rl2"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:background="#android:color/holo_green_dark">
<Button
android:id="#+id/bt2"
android:text="page2"
android:layout_height="100dp"
android:layout_width="100dp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rl1"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:background="#android:color/holo_red_dark">
<Button
android:id="#+id/bt1"
android:text="page1"
android:layout_height="100dp"
android:layout_width="100dp" />
</RelativeLayout>
</FrameLayout>
MainActivity:
[Activity(Label = "Aniamtion", MainLauncher = true)]
public class MainActivity : Activity
{
Button bt1,bt2;
RelativeLayout rl1, rl2;
int width;
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
// Set our view from the "main" layout resource
SetContentView(Resource.Layout.Main);
getScreenWidth();//get the screen's width, so we can define how much the animation can translate
initView();
initListener();
}
private void getScreenWidth()
{
DisplayMetrics dm = new DisplayMetrics();
WindowManager.DefaultDisplay.GetMetrics(dm);
width = dm.WidthPixels;
}
private void initListener()
{
bt1.Click += toPage1;
bt2.Click += toPage2;
}
private void toPage1(object sender, EventArgs e)
{
//use ObjectAnimator to complete it
ObjectAnimator objectAnimator = ObjectAnimator.OfFloat(rl1, "translationX", 0, -width);
objectAnimator.SetDuration(500);
objectAnimator.Start();
ObjectAnimator objectAnimator1 = ObjectAnimator.OfFloat(rl2, "translationX", width, 0);
objectAnimator1.SetDuration(500);
objectAnimator1.Start();
}
private void toPage2(object sender, EventArgs e)
{
ObjectAnimator objectAnimator = ObjectAnimator.OfFloat(rl1, "translationX", -width, 0);
objectAnimator.SetDuration(500);
objectAnimator.Start();
ObjectAnimator objectAnimator1 = ObjectAnimator.OfFloat(rl2, "translationX", 0, width);
objectAnimator1.SetDuration(500);
objectAnimator1.Start();
}
private void initView()
{
bt1 = FindViewById<Button>(Resource.Id.bt1);
bt2 = FindViewById<Button>(Resource.Id.bt2);
rl1 = FindViewById<RelativeLayout>(Resource.Id.rl1);
rl2 = FindViewById<RelativeLayout>(Resource.Id.rl2);
}
}
Second, about this OverridePendingTransition(Android.Resource.Animation.SlideInleft, Android.Resource.Animation.SlideInleft) method, the parameter you can use System resource, or you can custom it .
Update:
put this into your Resource->anim->SlideInRight, this is about customing animation in Xamarin.Android, it is same as Android, and this is document which you can refer to
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<translate android:fromXDelta="50%p"
android:toXDelta="0"
android:duration="300"/>
</set>