我注意到，當我自定義彈出項目外觀（如文檔中所述）時，當前的 FlyoutItem 不再被標記。從文檔中截取代碼以更改項目外觀：<Shell ...> ... <Shell.ItemTemplate> <DataTemplate> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="0.2*" /> <ColumnDefinition Width="0.8*" /> </Grid.ColumnDefinitions> <Image Source="{Binding FlyoutIcon}" Margin="5" HeightRequest="45" /> <Label Grid.Column="1" Text="{Binding Title}" FontAttributes="Italic" VerticalTextAlignment="Center" /> </Grid> </DataTemplate> </Shell.ItemTemplate></Shell>Shell.ItemTemplate 之前的屏幕截圖Shell.ItemTemplate 之后的屏幕截圖人們會認為一定還存在某種外殼。當前/活動/選定的ItemTemplate 自定義，但我找不到它。有什么想法可以自定義當前的 shell 項目外觀，或者至少使默認項目標記與 Shell.ItemTemplate 一起使用嗎？
2 回答
慕尼黑5688855
TA貢獻1848條經驗 獲得超2個贊
不幸的是。從Xamarin.Forms - Xaminals示例來看，也出現了這種現象。這應該是當前版本的 XF 中 Shell FlyoutItem 的限制。
<Shell.ItemTemplate>
? ? <DataTemplate >
? ? ? ? <Grid>
? ? ? ? ? ? <Grid.ColumnDefinitions>
? ? ? ? ? ? ? ? <ColumnDefinition Width="0.2*" />
? ? ? ? ? ? ? ? <ColumnDefinition Width="0.8*" />
? ? ? ? ? ? </Grid.ColumnDefinitions>
? ? ? ? ? ? <Image Source="{Binding FlyoutIcon}"
? ? ? ? ? ? ? ? Margin="5"
? ? ? ? ? ? ? ? HeightRequest="45" />
? ? ? ? ? ? <Label Grid.Column="1"
? ? ? ? ? ? ? ? Text="{Binding Title}"
? ? ? ? ? ? ? ? FontAttributes="Italic"
? ? ? ? ? ? ? ? VerticalTextAlignment="Center" />
? ? ? ? </Grid>
? ? </DataTemplate>
</Shell.ItemTemplate>
如果不使用Shell.ItemTemplate，則 selectitem 被標記：
否則 selectitem 未標記：
=====================================更新============== =================
解決方案：
如果給模板添加樣式，選擇后可以保持選中狀態。
Shell.Resources：添加FoutItemStyle。
<Style x:Key="FloutItemStyle" TargetType="Grid">
? ? <Setter Property="VisualStateManager.VisualStateGroups">
? ? ? ? <VisualStateGroupList>
? ? ? ? ? ? <VisualStateGroup x:Name="CommonStates">
? ? ? ? ? ? ? ? <VisualState x:Name="Normal" />
? ? ? ? ? ? ? ? <VisualState x:Name="Selected">
? ? ? ? ? ? ? ? ? ? <VisualState.Setters>
? ? ? ? ? ? ? ? ? ? ? ? <Setter Property="BackgroundColor" Value="Accent"/>
? ? ? ? ? ? ? ? ? ? </VisualState.Setters>
? ? ? ? ? ? ? ? </VisualState>
? ? ? ? ? ? </VisualStateGroup>
? ? ? ? </VisualStateGroupList>
? ? </Setter>
</Style>
在Shell.ItemTemplate中使用如下：
<Shell.ItemTemplate>
? ? <DataTemplate >
? ? ? ? <Grid Style="{StaticResource FloutItemStyle}">
? ? ? ? ? ? <Grid.ColumnDefinitions>
? ? ? ? ? ? ? ? <ColumnDefinition Width="0.2*" />
? ? ? ? ? ? ? ? <ColumnDefinition Width="0.8*" />
? ? ? ? ? ? </Grid.ColumnDefinitions>
? ? ? ? ? ? <Image Source="{Binding FlyoutIcon}"
? ? ? ? Margin="5"
? ? ? ? HeightRequest="45" />
? ? ? ? ? ? <Label Grid.Column="1"
? ? ? ? Text="{Binding Title}"
? ? ? ? FontAttributes="Italic"
? ? ? ? VerticalTextAlignment="Center" />
? ? ? ? </Grid>
? ? </DataTemplate>
</Shell.ItemTemplate>
最后展示一下效果：
幕布斯6054654
TA貢獻1876條經驗 獲得超7個贊
您可以使用綁定屬性。創建自定義網格
public class ShellItemGrid : Grid
{
public static readonly BindableProperty SelectedColorProperty = BindableProperty.Create("SelectedColor", typeof(Color), typeof(ShellItemGrid),Color.Transparent);
public Color SelectedColor
{
get { return (Color)GetValue(SelectedColorProperty); }
set { SetValue(SelectedColorProperty, value); }
}
}
定義網格的樣式
<Shell.Resources>
<Style x:Key="FlyoutItemStyle" TargetType="controls:ShellItemGrid">
<Setter Property="VisualStateManager.VisualStateGroups">
<VisualStateGroupList>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Selected">
<VisualState.Setters>
<Setter Property="SelectedColor" Value="Red"/>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Normal">
<VisualState.Setters>
<Setter Property="SelectedColor" Value="White"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateGroupList>
</Setter>
</Style>
定義項目模板并將Label的TextColor綁定到網格的SelectedColor
<Shell.ItemTemplate>
<DataTemplate>
<controls:ShellItemGrid x:Name="mGrid" Style="{StaticResource FlyoutItemStyle}" >
<Label HorizontalTextAlignment="Start"
VerticalTextAlignment="Center"
Margin="20,10,0,10"
Text="{Binding Title}"
TextColor="{Binding Source={x:Reference mGrid},Path=SelectedColor}"
FontSize="18" />
</controls:ShellItemGrid >
</DataTemplate>
</Shell.ItemTemplate>
- 2 回答
- 0 關注
- 151 瀏覽
添加回答
舉報
0/150
提交
取消