私は、下部にハンバーガーボタンを持つSplitView Menueを実装しようとしています。 VisualStudioをによって供給デザイナでは、それは次のように探しています:あなたは私はタイプMenueButtonsののObservableCollectionにリストビューアイテムをバインドしています見ることができるようにWindowsユニバーサルカスタムスプリットビューの問題を実装する
<Page.Resources>
<ValueConverters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
<vm:ShellViewModel x:Key="ShellVM"/>
</Page.Resources>
<Page.DataContext>
<Binding Source="{StaticResource ShellVM}"/>
</Page.DataContext>
<Grid Background="Transparent">
<SplitView x:Name="SplitView" IsPaneOpen="True" PaneBackground="Gray" Content="{Binding}" DisplayMode="Inline" VerticalAlignment="Bottom" Margin="0,0,0,40" Width="200" HorizontalAlignment="Left">
<SplitView.Pane>
<ListView ItemsSource="{Binding MenueButtons}" Height="Auto">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Height="Auto">
<Grid Width="8" Background="Yellow" HorizontalAlignment="Left" Height="20" Margin="-15,4,0,0" Visibility="{Binding Highlighted, Converter={StaticResource BooleanToVisibilityConverter}}"/>
<RadioButton FontFamily="Segoe MDL2 Assets" Style="{StaticResource TextBlockButtonStyle}" Content="{Binding SymbolIndex}" Margin="-10,0,14,0"/>
<TextBlock Text="{Binding Description}" Margin="-10,5,4,0"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</SplitView.Pane>
</SplitView>
<Button x:Name="HamburgerButton" FontFamily="Segoe MDL2 Assets" Content="" HorizontalAlignment="Left" VerticalAlignment="Bottom" Height="40" Foreground="White" FontSize="20"
Width="50" Background="Green"/>
</Grid>
XAMLコードということです。
は今、私はこのようなApp.xaml.csでSplitViewコンテンツに巣にフレームをしようとしている:
protected override void OnLaunched(LaunchActivatedEventArgs e)
{
Frame rootFrame = Window.Current.Content as Frame;
// Do not repeat app initialization when the Window already has content,
// just ensure that the window is active
if (rootFrame == null)
{
var shell = Window.Current.Content as Shell;
rootFrame = null;
if (shell == null)
{
shell = new Shell();
if (rootFrame == null)
{
rootFrame = new Frame();
rootFrame.Language = Windows.Globalization.ApplicationLanguages.Languages[0];
rootFrame.NavigationFailed += OnNavigationFailed;
if (e.PreviousExecutionState == ApplicationExecutionState.Terminated)
{
}
}
shell.DataContext = rootFrame;
Window.Current.Content = shell;
}
}
if (rootFrame.Content == null)
{
// When the navigation stack isn't restored navigate to the first page,
// configuring the new page by passing required information as a navigation
// parameter
rootFrame.Navigate(typeof(MainPage), e.Arguments);
}
// Ensure the current window is active
Window.Current.Activate();
}
私はMVVMを使用していますので、Shell.xaml.csの背後にあるコードは空ですパターン。
- をアプリケーションが起動された後のメインページが表示されるはずですが、それは を動作しません。私がいる問題に今
public class ShellViewModel:INotifyPropertyChanged
{
#region INotifyPropertyChanged Members
private ObservableCollection<Models.SplitView.MenueButton> _menueButtons;
public ObservableCollection<Models.SplitView.MenueButton> MenueButtons
{
get { return _menueButtons; }
set { _menueButtons = value; OnPropertyChanged("MenueButtons"); }
}
#endregion INotifyPropertyChanged Members
public event PropertyChangedEventHandler PropertyChanged;
private void OnPropertyChanged(string propertyName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
public ShellViewModel()
{
MenueButtons = new ObservableCollection<Models.SplitView.MenueButton>();
MenueButtons.Add(new Models.SplitView.MenueButton { Description = "Statistic", SymbolIndex = "\uEA40" });
MenueButtons.Add(new Models.SplitView.MenueButton { Description = "Settings", SymbolIndex = "\uE713" });
MenueButtons.Add(new Models.SplitView.MenueButton { Description = "Home", SymbolIndex = " \uE80F", Highlighted = true });
}
}
:しかし、ここでShellViewModelからのコードがあります
結合エラー:
Error: BindingExpression path error: 'MenueButtons' property not found on 'Windows.UI.Xaml.Controls.Frame'. BindingExpression: Path='MenueButtons' DataItem='Windows.UI.Xaml.Controls.Frame'; target element is 'Windows.UI.Xaml.Controls.ListView' (Name='null'); target property is 'ItemsSource' (type 'Object')
SplitViewが非常に小さいので、入れ子にされたフレームは画面の幅と高さ全体を使用しないと思います。
詳細情報: ShellViewModel.csにはObservableCollectionが含まれています。 Appを起動すると、緑色のハンバーガーメニューボタンしか表示されません。
このエラーを解決するにはどうすればよいですか?
シェルページの背後にコードを提供する必要があります。 _作業可能なサンプル_は、エラーを見つける方が簡単です。 – Jerin
@Jerin Ok投稿を更新します –