如何在 Xamarin.Android 中单击按钮时将一个片段替换为另一个片段？

Question

我想要如下画面：

当我单击 IMAGE 1 和 IMAGE 2 按钮时，我希望在 IMAGE ZONE 中分别出现 Image1.jpg 和 Image2.jpg。我希望 Image1.jpg 和 Image2.jpg 位于不同的片段中，并在单击按钮时替换这些片段，而不是简单地更改按钮上 IMAGE ZONE 中 ImageView 的 android:src点击。我希望 Image1.jpg 成为打开 activity 时出现的第一个图像。我找不到如何使用 Xamarin.Android

中的片段

Answer 1

您可以先创建两个 Fragment 及其 xml。

片段一:

public class Fragment1 : Android.Support.V4.App.Fragment
{
    public override void OnCreate(Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);

        // Create your fragment here
    }

    public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
    {
        // Use this to return your custom view for this Fragment
        return inflater.Inflate(Resource.Layout.layoutFragment1, container, false);

        //return base.OnCreateView(inflater, container, savedInstanceState);
    }
}

及其 xml :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/fragment1">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/th2"/>

</LinearLayout>

FragementTwo :

public class Fragment2 : Android.Support.V4.App.Fragment
{
    public override void OnCreate(Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);

        // Create your fragment here
    }

    public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
    {
        // Use this to return your custom view for this Fragment
        return inflater.Inflate(Resource.Layout.layoutFragment2, container, false);

        //return base.OnCreateView(inflater, container, savedInstanceState);
    }
}

及其 xml :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/fragment2">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/th2"/>

</LinearLayout>

然后在 MainActivity 中，你可以设置它的 xml 如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical">

    <LinearLayout
        android:gravity="center_horizontal"
        android:layout_width="match_parent"
        android:layout_height="80dip"
        android:orientation="horizontal">

        <Button
            android:id="@+id/buttonone"
            android:layout_width="150dip"
            android:layout_height="80dip"
            android:text="FragmentOne"/>

        <Button
            android:id="@+id/buttontwo"
            android:layout_width="150dip"
            android:layout_height="80dip"
            android:text="FragmentTwo"/>

    </LinearLayout>

    <RelativeLayout
        android:id="@+id/containerView"
        android:layout_width="match_parent"
        android:layout_height="430dip">

    </RelativeLayout> 

</LinearLayout>

最后，在MainActivity.cs实现这个功能：

public class MainActivity : AppCompatActivity
{
    Android.Support.V4.App.Fragment fragmentOne;
    Android.Support.V4.App.Fragment fragmentTwo;
    Android.Support.V4.App.FragmentTransaction fragmentManager;
    [Obsolete]
    protected override void OnCreate(Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);
        Xamarin.Essentials.Platform.Init(this, savedInstanceState);
        // Set our view from the "main" layout resource
        SetContentView(Resource.Layout.activity_main);

        Button buttonone = FindViewById<Button>(Resource.Id.buttonone);
        buttonone.Click += Buttonone_Click;

        Button buttontwo = FindViewById<Button>(Resource.Id.buttontwo);
        buttontwo.Click += Buttontwo_Click;
        fragmentOne = new Fragment1();
        fragmentTwo = new Fragment2();

        fragmentManager = SupportFragmentManager.BeginTransaction();
        fragmentManager.Add(Resource.Id.containerView, fragmentOne);
        //adding first fragment when entering activity
        fragmentManager.Commit();
    }

    private void Buttonone_Click(object sender, System.EventArgs e)
    {
        //throw new System.NotImplementedException();
        Console.WriteLine("Buttonone_Click");
        fragmentManager = SupportFragmentManager.BeginTransaction();
        // replace to be the first fragment 
        fragmentManager.Replace(Resource.Id.containerView, fragmentOne);
        fragmentManager.Commit();
    }

    private void Buttontwo_Click(object sender, System.EventArgs e)
    {
        //throw new System.NotImplementedException();
        Console.WriteLine("Buttontwo_Click");

        fragmentManager = SupportFragmentManager.BeginTransaction();
        // replace ro be the second fragment
        fragmentManager.Replace(Resource.Id.containerView, fragmentTwo);
        fragmentManager.Commit();
    }
}

效果如下：

如何在 Xamarin.Android 中单击按钮时将一个片段替换为另一个片段？

How to replace one fragment with another on button click in Xamarin.Android?

replace

fragment

buttonclick

xamarin.android