我面臨來自 XamarinCommunityToolkit 的 TabView 的問題。
MainPage 有兩個選項卡“A”和“B”,“A”顯示一些內容,“B”用作到另一個 ContentPage“DetailsPage”的導航。此外,MainPage 已設定 NavigationPage.HasNavigationBar="false" 并且不應顯示任何導航欄。
啟動時,導航欄按預期不可見。單擊選項卡“B”,然后單擊“詳細資訊頁面”上的后退按鈕時,TabView 似乎改變了它的高度并占用了額外的空間。
這里基本上是所有的代碼:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:views="http://xamarin.com/schemas/2020/toolkit"
x:Class="App1.MainPage"
NavigationPage.HasNavigationBar="false"
>
<StackLayout>
<views:TabView
TabStripPlacement="Bottom"
BackgroundColor="Gold"
TabStripHeight="60"
TabStripBackgroundColor="ForestGreen"
>
<views:TabViewItem
Text="A">
<Grid BackgroundColor="Cyan"/>
</views:TabViewItem>
<views:TabViewItem
Text="B"
TabTapped="ShowDetailsPage">
</views:TabViewItem>
</views:TabView>
</StackLayout>
</ContentPage>
在代碼隱藏檔案 App.xaml.cs 中添加了另外一行,以便能夠導航到“DetailsPage”:
MainPage = new NavigationPage(new MainPage());
這是不希望的“金條”的結果: TabView 高度的不希望變化
我已經嘗試過:
- 設定 NavigationPage.SetHasNavigationBar(this, false); 在 MainPage 的建構式中
- 設定 NavigationPage.SetHasNavigationBar(this, false); 在 OnAppearing 事件中
非常感謝任何幫助或提示。
編輯/添加: Alexander May 提到的 tabview 布局錯誤 的提示讓我們進一步縮小了問題的范圍。
通過任何導航物件(例如 TabViewItem 內容中的按鈕)導航到詳細資訊頁面時也存在此問題。
因此,樣本可以進一步減少到一個選項卡:
<StackLayout>
<views:TabView
TabStripPlacement="Bottom"
BackgroundColor="Gold"
TabStripHeight="60"
TabStripBackgroundColor="ForestGreen"
>
<views:TabViewItem
Text="A">
<Grid BackgroundColor="Cyan">
<Button Clicked="ShowDetailsPage" Text="Click Me" BackgroundColor="LightPink"></Button>
</Grid>
</views:TabViewItem>
</views:TabView>
</StackLayout>
uj5u.com熱心網友回復:
在社區工具包站點上有一個開放的錯誤:https ://github.com/xamarin/XamarinCommunityToolkit/issues/625
uj5u.com熱心網友回復:
不受歡迎的“金條”是由于 tabview 的布局錯誤,請嘗試我的解決方案,效果很好!
以下是xaml中的代碼:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:views="http://xamarin.com/schemas/2020/toolkit"
NavigationPage.HasNavigationBar="False"
x:Class="AppNavTab.MainPage"
>
<Grid>
<views:TabView
TabStripPlacement="Bottom"
TabStripBackgroundColor="Green"
TabStripHeight="60"
TabContentBackgroundColor="Cyan">
<views:TabViewItem
Text="A"
TextColor="Black"
FontSize="12">
<Grid BackgroundColor="Cyan">
<Label
HorizontalOptions="Center"
VerticalOptions="Center"
Text="TabContent1" />
</Grid>
</views:TabViewItem>
<views:TabViewItem
Text="B"
TextColor="Black"
FontSize="12"
TabTapped="TabViewItem_TabTapped">
</views:TabViewItem>
</views:TabView>
</Grid>
下面是xaml背后的代碼:
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
}
private void TabViewItem_TabTapped(object sender, Xamarin.CommunityToolkit.UI.Views.TabTappedEventArgs e)
{
Navigation.PushAsync(new DetailPage());
}
}
解決方法 2:
<Grid RowSpacing="0" ColumnSpacing="0" x:Name="grid" >
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="60"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackLayout BackgroundColor="Cyan" Grid.ColumnSpan="2">
</StackLayout>
<Button Text="item1" Grid.Row="1" Grid.Column="0" Clicked="Button_Clicked1"/>
<Button Text="item2" Grid.Row="1" Grid.Column="1" Clicked="Button_Clicked2"/>
</Grid>
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/432726.html
