如何使用 MVVMCross 6.2 设置选项卡的标题？
How to set Title of Tab with MVVMCross 6.2?
我正在尝试弄清楚如何在 Xamarin Android 中使用 MVVMCross 6.2+ 将本地化字符串正确设置为选项卡标题（或动态更改选项卡标题）。
我应该如何在简单的示例应用程序中设置选项卡的标题？
预先感谢您的帮助。
这是简单的示例应用程序：
MvvmCrossTabs.Core
HomeViewModel.cs
using System.Collections.Generic;
using System.Threading.Tasks;
using MvvmCross.Commands;
using MvvmCross.Logging;
using MvvmCross.Navigation;
using MvvmCross.ViewModels;
namespace MvvmCrossTabs.Core.ViewModels
{
public class HomeViewModel : MvxNavigationViewModel
{
public IMvxAsyncCommand ShowInitialViewModelsCommand { get; private set; }
public HomeViewModel(IMvxLogProvider logProvider, IMvxNavigationService navigationService) : base(logProvider, navigationService)
{
ShowInitialViewModelsCommand = new MvxAsyncCommand(ShowInitialViewModels);
}
private async Task ShowInitialViewModels()
{
await Task.WhenAll(new List<Task>
{
NavigationService.Navigate<Tab1ViewModel>(),
NavigationService.Navigate<Tab2ViewModel>(),
NavigationService.Navigate<Tab3ViewModel>()
});
}
}
}
Tab1ViewModel.cs (Tab2ViewModel.cs, Tab3ViewModel.cs)
using MvvmCross.Logging;
using MvvmCross.Navigation;
using MvvmCross.ViewModels;
namespace MvvmCrossTabs.Core.ViewModels
{
public class Tab1ViewModel : MvxNavigationViewModel
{
public Tab1ViewModel(IMvxLogProvider logProvider, IMvxNavigationService navigationService) : base(logProvider, navigationService)
{
}
}
}
App.cs
using MvvmCross.IoC;
using MvvmCross.ViewModels;
using MvvmCrossTabs.Core.ViewModels;
namespace MvvmCrossTabs.Core
{
public class App : MvxApplication
{
public override void Initialize()
{
CreatableTypes()
.EndingWith("Service")
.AsInterfaces()
.RegisterAsLazySingleton();
RegisterAppStart<HomeViewModel>();
}
}
}
MvvmCrossTabs.Android
MainApplication.cs
using System;
using Android.App;
using Android.Runtime;
using MvvmCross.Droid.Support.V7.AppCompat;
using MvvmCrossTabs.Core;
namespace MvvmCrossTabs.Android
{
[Application]
public class MainApplication : MvxAppCompatApplication<MvxAppCompatSetup<App>, App>
{
public MainApplication() : base() { }
public MainApplication(IntPtr javaReference, JniHandleOwnership transfer) : base(javaReference, transfer) { }
}
}
home.axml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/maincontent"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways" />
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="enterAlways"
app:tabGravity="fill"
app:tabMaxWidth="0dp" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
tab1.axml (tab2.axml, tab3.axml)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:id="@+id/main_frame"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
</LinearLayout>
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
</resources>
HomeView.cs
using Android.App;
using Android.Content.PM;
using Android.OS;
using Android.Support.V7.Widget;
using MvvmCross.Droid.Support.V7.AppCompat;
using MvvmCross.Platforms.Android.Presenters.Attributes;
using MvvmCrossTabs.Core.ViewModels;
namespace MvvmCrossTabs.Android
{
[Activity(Label = "@string/app_name", LaunchMode = LaunchMode.SingleTask, Theme = "@style/AppTheme", MainLauncher = true)]
[MvxActivityPresentation]
public class HomeView : MvxAppCompatActivity<HomeViewModel>
{
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
SetContentView(Resource.Layout.home);
// Replaces Action Bar with new Toolbar.
var toolbar = FindViewById<Toolbar>(Resource.Id.toolbar);
SetSupportActionBar(toolbar);
ViewModel.ShowInitialViewModelsCommand.Execute();
}
}
}
Tab1View.cs (Tab2View.cs, Tab3View.cs)
using Android.OS;
using Android.Runtime;
using Android.Views;
using MvvmCross.Droid.Support.V4;
using MvvmCross.Platforms.Android.Binding.BindingContext;
using MvvmCross.Platforms.Android.Presenters.Attributes;
using MvvmCrossTabs.Core.ViewModels;
namespace MvvmCrossTabs.Android.Views
{
[MvxTabLayoutPresentation(TabLayoutResourceId = Resource.Id.tabs, ViewPagerResourceId = Resource.Id.viewpager, Title = "Tab 1", ActivityHostViewModelType = typeof(HomeViewModel))]
[Register(nameof(Tab1View))]
public class Tab1View : MvxFragment<Tab1ViewModel>
{
public override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
// Create your fragment here
}
public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
{
base.OnCreateView(inflater, container, savedInstanceState);
return this.BindingInflate(Resource.Layout.tab1, null);
}
}
}
你必须这样做：
if (fragments == null || fragments.Count == 0)
{
_firstFragment= (YourFragmentType)Activator.CreateInstance(typeof(YourFragmentType));
_firstFragment.ViewModel = YourVM;
_secondFragment= (YourFragmentType)Activator.CreateInstance(typeof(YourFragmentType));
_secondFragment.ViewModel = YourVM;
_thridFragment= (YourFragmentType)Activator.CreateInstance(typeof(YourFragmentType));
_thridFragment.ViewModel = YourVM;
// Strings from RESX Localization
fragments = new Dictionary<string, Fragment>
{
{ Strings.first_localized_string, _firstFragment},
{ Strings.second_localized_string, _secondFragment},
{ Strings.thrid_localized_string, _thridFragment}
};
}
viewPager = View.FindViewById<ViewPager>(Resource.Id.viewpager);
adapter = new TabsFragmentPagerAdapter(ChildFragmentManager, fragments);
viewPager.Adapter = adapter;
var tabLayout = View.FindViewById<TabLayout>(Resource.Id.tabs);
tabLayout.SetupWithViewPager(viewPager);
您的适配器：
public class TabsFragmentPagerAdapter : FragmentPagerAdapter
{
private readonly Fragment[] fragments;
private readonly string[] titles;
public TabsFragmentPagerAdapter(FragmentManager fm, Dictionary<string, Fragment> fragments) : base(fm)
{
this.fragments = fragments.Values.ToArray();
this.titles = fragments.Keys.ToArray();
}
public override int Count => fragments.Length;
private String GetCharSeuenceFromString(string s)
{
return new String(s);
}
public override Object InstantiateItem(ViewGroup container, int position)
{
return base.InstantiateItem(container, position);
}
public override void SetPrimaryItem(ViewGroup container, int position, Object @object)
{
base.SetPrimaryItem(container, position, @object);
}
public override Fragment GetItem(int position)
{
return fragments[position];
}
public override ICharSequence GetPageTitleFormatted(int position)
{
return GetCurrentPageTitle(position);
}
private ICharSequence GetCurrentPageTitle(int position)
{
return GetCharSeuenceFromString(titles[position]);
}
}
编码愉快！
P.S。不要将片段与泛型一起使用。
当您使用 ShowInitialViewModelsCommand 创建选项卡时，built-in 演示者会创建一个 MvxViewPagerFragmentInfo objects 的列表，从属性中传递标题值。您可以在 MvvmCross 源代码的 ShowViewPagerFragment 方法中看到这种情况。
MvxViewPagerFragmentInfo objects 的列表随后被传递到为 ViewPager 创建的 MvxCachingFragmentStatePagerAdapter 中。你可以看到正在发生 here
MvxCachingFragmentStatePagerAdapter 继承自 MvxFragmentPagerAdapter class。在 MvxFragmentPagerAdapter class 里面终于是你提供的 Title 实际使用的地方了。你可以看到它被用在 GetPageTitleFormatted 方法中 here
因此，为了在运行时更改标题，您可以执行以下操作：
Subclass 默认演示者并覆盖 ShowViewPagerFragment 方法（它被标记为虚拟）并提供正确的本地化标题字符串而不是属性
中定义的字符串
这是一个如何完成此操作的示例：
1.) 创建自定义演示者并覆盖 ShowViewPagerFragment
public class LocalizedTabPresenter : MvxAppCompatViewPresenter
{
public LocalizedTabPresenter(IEnumerable<Assembly> androidViewAssemblies) : base(androidViewAssemblies)
{
}
protected override Task<bool> ShowViewPagerFragment(Type view, MvxViewPagerFragmentPresentationAttribute attribute, MvxViewModelRequest request)
{
if (attribute.ViewModelType == typeof(Tab1ViewModel)) {
attribute.Title = "My Localized Title for Tab 1"
}
return base.ShowViewPagerFragment(view, attribute, request);
}
}
2.) 在您的 Setup.cs class 中，让 MvvmCross 知道改用自定义演示器
protected override IMvxAndroidViewPresenter CreateViewPresenter()
{
return new LocalizedTabPresenter(AndroidViewAssemblies);
}
注：
- 只有当您需要 仅设置一次标题 时，这才有效
应用启动并首次设置选项卡。
如果您的情况是在应用 运行 时标题可以多次更改，您需要子class MvxCachingFragmentStatePagerAdapter 并覆盖 GetPageTitleFormatted方法并提供更适合您的用例的自定义实现。
希望对您有所帮助。
另一种可能的解决方案是使用 IMvxOverridePresentationAttribute 界面。
这样您就可以在运行时从片段本身更改这些值。
要做到这一点，只需在您的选项卡片段中实现 IMvxOverridePresentationAttribute，然后 return 如下所示：
public MvxBasePresentationAttribute PresentationAttribute(MvxViewModelRequest request)
{
return new MvxTabLayoutPresentationAttribute(title: _("Results"), viewPagerResourceId: Resource.Id.viewPager, tabLayoutResourceId: Resource.Id.tab_layout, fragmentHostViewType: typeof(HostFragment));
}
我喜欢这种方法，因为我不需要在应用程序级别更改任何内容，而且我拥有与该片段相关的所有代码，具体包含在该片段中。
我一直在使用它，它一直运行良好。
请注意 this.ViewModel 属性 在 PresentationAttribute
期间将为空
如果您想更详细地了解它的工作原理，请查看 this
我正在尝试弄清楚如何在 Xamarin Android 中使用 MVVMCross 6.2+ 将本地化字符串正确设置为选项卡标题（或动态更改选项卡标题）。 我应该如何在简单的示例应用程序中设置选项卡的标题？ 预先感谢您的帮助。
这是简单的示例应用程序：
MvvmCrossTabs.Core
HomeViewModel.cs
using System.Collections.Generic;
using System.Threading.Tasks;
using MvvmCross.Commands;
using MvvmCross.Logging;
using MvvmCross.Navigation;
using MvvmCross.ViewModels;
namespace MvvmCrossTabs.Core.ViewModels
{
public class HomeViewModel : MvxNavigationViewModel
{
public IMvxAsyncCommand ShowInitialViewModelsCommand { get; private set; }
public HomeViewModel(IMvxLogProvider logProvider, IMvxNavigationService navigationService) : base(logProvider, navigationService)
{
ShowInitialViewModelsCommand = new MvxAsyncCommand(ShowInitialViewModels);
}
private async Task ShowInitialViewModels()
{
await Task.WhenAll(new List<Task>
{
NavigationService.Navigate<Tab1ViewModel>(),
NavigationService.Navigate<Tab2ViewModel>(),
NavigationService.Navigate<Tab3ViewModel>()
});
}
}
}
Tab1ViewModel.cs (Tab2ViewModel.cs, Tab3ViewModel.cs)
using MvvmCross.Logging;
using MvvmCross.Navigation;
using MvvmCross.ViewModels;
namespace MvvmCrossTabs.Core.ViewModels
{
public class Tab1ViewModel : MvxNavigationViewModel
{
public Tab1ViewModel(IMvxLogProvider logProvider, IMvxNavigationService navigationService) : base(logProvider, navigationService)
{
}
}
}
App.cs
using MvvmCross.IoC;
using MvvmCross.ViewModels;
using MvvmCrossTabs.Core.ViewModels;
namespace MvvmCrossTabs.Core
{
public class App : MvxApplication
{
public override void Initialize()
{
CreatableTypes()
.EndingWith("Service")
.AsInterfaces()
.RegisterAsLazySingleton();
RegisterAppStart<HomeViewModel>();
}
}
}
MvvmCrossTabs.Android
MainApplication.cs
using System;
using Android.App;
using Android.Runtime;
using MvvmCross.Droid.Support.V7.AppCompat;
using MvvmCrossTabs.Core;
namespace MvvmCrossTabs.Android
{
[Application]
public class MainApplication : MvxAppCompatApplication<MvxAppCompatSetup<App>, App>
{
public MainApplication() : base() { }
public MainApplication(IntPtr javaReference, JniHandleOwnership transfer) : base(javaReference, transfer) { }
}
}
home.axml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/maincontent"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways" />
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="enterAlways"
app:tabGravity="fill"
app:tabMaxWidth="0dp" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
tab1.axml (tab2.axml, tab3.axml)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:id="@+id/main_frame"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
</LinearLayout>
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
</resources>
HomeView.cs
using Android.App;
using Android.Content.PM;
using Android.OS;
using Android.Support.V7.Widget;
using MvvmCross.Droid.Support.V7.AppCompat;
using MvvmCross.Platforms.Android.Presenters.Attributes;
using MvvmCrossTabs.Core.ViewModels;
namespace MvvmCrossTabs.Android
{
[Activity(Label = "@string/app_name", LaunchMode = LaunchMode.SingleTask, Theme = "@style/AppTheme", MainLauncher = true)]
[MvxActivityPresentation]
public class HomeView : MvxAppCompatActivity<HomeViewModel>
{
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
SetContentView(Resource.Layout.home);
// Replaces Action Bar with new Toolbar.
var toolbar = FindViewById<Toolbar>(Resource.Id.toolbar);
SetSupportActionBar(toolbar);
ViewModel.ShowInitialViewModelsCommand.Execute();
}
}
}
Tab1View.cs (Tab2View.cs, Tab3View.cs)
using Android.OS;
using Android.Runtime;
using Android.Views;
using MvvmCross.Droid.Support.V4;
using MvvmCross.Platforms.Android.Binding.BindingContext;
using MvvmCross.Platforms.Android.Presenters.Attributes;
using MvvmCrossTabs.Core.ViewModels;
namespace MvvmCrossTabs.Android.Views
{
[MvxTabLayoutPresentation(TabLayoutResourceId = Resource.Id.tabs, ViewPagerResourceId = Resource.Id.viewpager, Title = "Tab 1", ActivityHostViewModelType = typeof(HomeViewModel))]
[Register(nameof(Tab1View))]
public class Tab1View : MvxFragment<Tab1ViewModel>
{
public override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
// Create your fragment here
}
public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
{
base.OnCreateView(inflater, container, savedInstanceState);
return this.BindingInflate(Resource.Layout.tab1, null);
}
}
}
你必须这样做：
if (fragments == null || fragments.Count == 0)
{
_firstFragment= (YourFragmentType)Activator.CreateInstance(typeof(YourFragmentType));
_firstFragment.ViewModel = YourVM;
_secondFragment= (YourFragmentType)Activator.CreateInstance(typeof(YourFragmentType));
_secondFragment.ViewModel = YourVM;
_thridFragment= (YourFragmentType)Activator.CreateInstance(typeof(YourFragmentType));
_thridFragment.ViewModel = YourVM;
// Strings from RESX Localization
fragments = new Dictionary<string, Fragment>
{
{ Strings.first_localized_string, _firstFragment},
{ Strings.second_localized_string, _secondFragment},
{ Strings.thrid_localized_string, _thridFragment}
};
}
viewPager = View.FindViewById<ViewPager>(Resource.Id.viewpager);
adapter = new TabsFragmentPagerAdapter(ChildFragmentManager, fragments);
viewPager.Adapter = adapter;
var tabLayout = View.FindViewById<TabLayout>(Resource.Id.tabs);
tabLayout.SetupWithViewPager(viewPager);
您的适配器：
public class TabsFragmentPagerAdapter : FragmentPagerAdapter
{
private readonly Fragment[] fragments;
private readonly string[] titles;
public TabsFragmentPagerAdapter(FragmentManager fm, Dictionary<string, Fragment> fragments) : base(fm)
{
this.fragments = fragments.Values.ToArray();
this.titles = fragments.Keys.ToArray();
}
public override int Count => fragments.Length;
private String GetCharSeuenceFromString(string s)
{
return new String(s);
}
public override Object InstantiateItem(ViewGroup container, int position)
{
return base.InstantiateItem(container, position);
}
public override void SetPrimaryItem(ViewGroup container, int position, Object @object)
{
base.SetPrimaryItem(container, position, @object);
}
public override Fragment GetItem(int position)
{
return fragments[position];
}
public override ICharSequence GetPageTitleFormatted(int position)
{
return GetCurrentPageTitle(position);
}
private ICharSequence GetCurrentPageTitle(int position)
{
return GetCharSeuenceFromString(titles[position]);
}
}
编码愉快！
P.S。不要将片段与泛型一起使用。
当您使用 ShowInitialViewModelsCommand 创建选项卡时，built-in 演示者会创建一个 MvxViewPagerFragmentInfo objects 的列表，从属性中传递标题值。您可以在 MvvmCross 源代码的 ShowViewPagerFragment 方法中看到这种情况。
MvxViewPagerFragmentInfo objects 的列表随后被传递到为 ViewPager 创建的 MvxCachingFragmentStatePagerAdapter 中。你可以看到正在发生 here
MvxCachingFragmentStatePagerAdapter 继承自 MvxFragmentPagerAdapter class。在 MvxFragmentPagerAdapter class 里面终于是你提供的 Title 实际使用的地方了。你可以看到它被用在 GetPageTitleFormatted 方法中 here
因此，为了在运行时更改标题，您可以执行以下操作：
Subclass 默认演示者并覆盖 ShowViewPagerFragment 方法（它被标记为虚拟）并提供正确的本地化标题字符串而不是属性
这是一个如何完成此操作的示例：
1.) 创建自定义演示者并覆盖 ShowViewPagerFragment
public class LocalizedTabPresenter : MvxAppCompatViewPresenter
{
public LocalizedTabPresenter(IEnumerable<Assembly> androidViewAssemblies) : base(androidViewAssemblies)
{
}
protected override Task<bool> ShowViewPagerFragment(Type view, MvxViewPagerFragmentPresentationAttribute attribute, MvxViewModelRequest request)
{
if (attribute.ViewModelType == typeof(Tab1ViewModel)) {
attribute.Title = "My Localized Title for Tab 1"
}
return base.ShowViewPagerFragment(view, attribute, request);
}
}
2.) 在您的 Setup.cs class 中，让 MvvmCross 知道改用自定义演示器
protected override IMvxAndroidViewPresenter CreateViewPresenter()
{
return new LocalizedTabPresenter(AndroidViewAssemblies);
}
注：
- 只有当您需要 仅设置一次标题 时，这才有效 应用启动并首次设置选项卡。
如果您的情况是在应用 运行 时标题可以多次更改，您需要子class MvxCachingFragmentStatePagerAdapter 并覆盖 GetPageTitleFormatted方法并提供更适合您的用例的自定义实现。
希望对您有所帮助。
另一种可能的解决方案是使用 IMvxOverridePresentationAttribute 界面。
这样您就可以在运行时从片段本身更改这些值。
要做到这一点，只需在您的选项卡片段中实现 IMvxOverridePresentationAttribute，然后 return 如下所示：
public MvxBasePresentationAttribute PresentationAttribute(MvxViewModelRequest request)
{
return new MvxTabLayoutPresentationAttribute(title: _("Results"), viewPagerResourceId: Resource.Id.viewPager, tabLayoutResourceId: Resource.Id.tab_layout, fragmentHostViewType: typeof(HostFragment));
}
我喜欢这种方法，因为我不需要在应用程序级别更改任何内容，而且我拥有与该片段相关的所有代码，具体包含在该片段中。
我一直在使用它，它一直运行良好。
请注意 this.ViewModel 属性 在 PresentationAttribute
如果您想更详细地了解它的工作原理，请查看 this