我有2个 XAML ,其中第一个将在运行时显示第二个的列表。下面是第一个xaml代码。
1。 BrowserWindowView.xaml
<Page
x:Class="AffiliaTool.Lib.View.BrowserWindowView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:i="using:Microsoft.Xaml.Interactivity"
xmlns:local="using:AffiliaTool.Lib.View"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:tk="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:vm="using:AffiliaTool.Lib.ViewModel"
mc:Ignorable="d">
<Page.DataContext>
<vm:BrowserWindowViewModel />
</Page.DataContext>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="41" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid>
<Button Width="100" Content="NEW TAB">
<i:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:InvokeCommandAction Command="{Binding OnNewTabClicked}" />
</core:EventTriggerBehavior>
</i:Interaction.Behaviors>
</Button>
</Grid>
<tk:TabView
Name="TabViewBar"
Grid.Row="1"
ItemsSource="{Binding Tabs, Mode=TwoWay}">
<i:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Loaded">
<core:ChangePropertyAction
PropertyName="TabViewBar"
TargetObject="{Binding}"
Value="{Binding ElementName=TabViewBar, Mode=TwoWay}" />
<core:InvokeCommandAction Command="{Binding OnTabViewLoaded}" />
</core:EventTriggerBehavior>
</i:Interaction.Behaviors>
<tk:TabView.ItemHeaderTemplate>
<DataTemplate>
<TextBlock Text="Hello Tab" />
</DataTemplate>
</tk:TabView.ItemHeaderTemplate>
<tk:TabView.ItemTemplate>
<DataTemplate>
<local:BrowserTabWidget DataContext="{Binding}" />
</DataTemplate>
</tk:TabView.ItemTemplate>
</tk:TabView>
</Grid>
</Page>
第一个xaml用于生成新窗口,并在初始选项卡项中显示第一个 WebView 对象。呈现WebView的第二个xaml代码如下所示。
2。 BrowserTabWidget.xaml
<UserControl
x:Class="AffiliaTool.Lib.View.BrowserTabWidget"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:i="using:Microsoft.Xaml.Interactivity"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:vm="using:AffiliaTool.Lib.ViewModel"
mc:Ignorable="d">
<UserControl.DataContext>
<vm:BrowserTabViewModel />
</UserControl.DataContext>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="41" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid x:Name="Toolbar" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="42" />
<ColumnDefinition Width="42" />
<ColumnDefinition Width="42" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="42" />
</Grid.ColumnDefinitions>
<Button Grid.Column="0" Background="Transparent">
<Button.Content>
<TextBlock
Margin="0,0,4,0"
VerticalAlignment="Center"
FontFamily="Segoe MDL2 Assets"
FontSize="18"
Foreground="#f06a35"
Text="" />
</Button.Content>
</Button>
<Button Grid.Column="1" Background="Transparent">
<Button.Content>
<TextBlock
Margin="0,0,4,0"
VerticalAlignment="Center"
FontFamily="Segoe MDL2 Assets"
FontSize="18"
Foreground="#f06a35"
Text="" />
</Button.Content>
</Button>
<Button Grid.Column="2" Background="Transparent">
<Button.Content>
<TextBlock
Margin="0,0,4,0"
VerticalAlignment="Center"
FontFamily="Segoe MDL2 Assets"
FontSize="18"
Foreground="#f06a35"
Text="" />
</Button.Content>
</Button>
<TextBox
Grid.Column="3"
Height="32"
Margin="4,0"
Background="White"
BorderBrush="#f06a35"
BorderThickness="1"
FontSize="18" />
<Button Grid.Column="4" Background="Transparent">
<Button.Content>
<TextBlock
Margin="0,0,4,0"
VerticalAlignment="Center"
FontFamily="Segoe MDL2 Assets"
FontSize="18"
Foreground="#f06a35"
Text="" />
</Button.Content>
</Button>
</Grid>
<WebView x:Name="WebBrowser" Grid.Row="1">
<i:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Loaded">
<core:ChangePropertyAction
PropertyName="WebBrowser"
TargetObject="{Binding}"
Value="{Binding ElementName=WebBrowser, Mode=TwoWay}" />
<core:InvokeCommandAction Command="{Binding OnBrowserLoaded}" />
</core:EventTriggerBehavior>
</i:Interaction.Behaviors>
</WebView>
</Grid>
</UserControl>
对于第一个xaml,我有一个如下所示的 ViewModel 类代码,并且它具有 RelayCommand 来处理“ NEW TAB”按钮的单击。
namespace AffiliaTool.Lib.ViewModel
{
public class BrowserWindowViewModel : ViewModelBase
{
private List<BrowserTabViewModel> _tabs;
private RelayCommand _onNewTabClicked;
private RelayCommand _onTabViewLoaded;
private IWebScrapper _scrapper;
private TabView _tabView;
public BrowserWindowViewModel()
{
_tabs = new List<BrowserTabViewModel>();
}
public IWebScrapper Scrapper
{
set
{
_scrapper = value;
}
}
public TabView TabViewBar
{
get
{
return _tabView;
}
set
{
Set("TabViewBar", ref _tabView, value);
}
}
public List<BrowserTabViewModel> Tabs
{
get
{
return _tabs;
}
private set { }
}
public RelayCommand OnTabViewLoaded
{
get
{
return _onTabViewLoaded ?? (_onTabViewLoaded = new RelayCommand(() =>
{
Debug.WriteLine(">>> TAB VIEW LOADED...");
}));
}
}
public RelayCommand OnNewTabClicked
{
get
{
return _onNewTabClicked ?? (_onNewTabClicked = new RelayCommand(() =>
{
var tab = new BrowserTabViewModel
{
Scrapper = _scrapper
};
Tabs.Add(tab);
}));
}
}
}
}
我的问题是:为什么每次单击“ NEW TAB” 按钮时,应该将新的 BrowserTabViewModel 对象添加到列表中,并且在UI中创建的其他选项卡不起作用?我不能在第一个XAML的 TabView 元素中添加新的TAB?没有检测到错误。
我已经苦苦挣扎了2天,试图以MVVM方式添加新的 TabViewItem ,还是有可能启用此功能的MVVM框架?