MahApps TabControl 绑定

Question

您好，我是 wpf 的新手，我正在使用 MVVM light。我有一个 Mahapps 选项卡控件绑定到主视图的视图模型中的列表的视图，我有一个将项目添加到列表的按钮。 mahapps tabitem 绑定到内容视图但由于某种原因它不显示任何内容，即使当我将项目添加到绑定列表时它也添加了一个新的选项卡项目。可能我做错了欢迎任何建议。提前致谢

TickersView

<UserControl x:Class="V2.Views.TickersView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls"
         xmlns:local="clr-namespace:V2.Views"
         xmlns:y="clr-namespace:V2.ViewModel"
         xmlns:simpleChildWindow="clr-namespace:MahApps.Metro.SimpleChildWindow;assembly=MahApps.Metro.SimpleChildWindow"


         mc:Ignorable="d"             
         d:DesignHeight="800" d:DesignWidth="600"
         DataContext="{Binding Tickers, Source={StaticResource Locator}}">




<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="15*"/>
    </Grid.RowDefinitions>
    <Button   Style="{StaticResource MaterialDesignFloatingActionMiniDarkButton}"  Content="+" VerticalContentAlignment="Center" Command="{Binding AddTickerCommand , Mode=OneWay}" HorizontalAlignment="Right" VerticalAlignment="Center"  Grid.Row="0" Margin="0,0,15,0"  BorderBrush="{x:Null}"  />
    <Controls:MetroAnimatedTabControl
        ItemsSource="{Binding TickersList}"

        Grid.Row="1">

        <Controls:MetroAnimatedTabControl.ItemContainerStyle>
            <Style TargetType="TabItem">
                <Setter Property="Header" Value="{Binding Name}"/>
            </Style>
        </Controls:MetroAnimatedTabControl.ItemContainerStyle>
        <Controls:MetroAnimatedTabControl.ContentTemplate>
            <DataTemplate DataType="{x:Type y:TickerViewModel}">
                <ContentControl Content="{Binding TickerView}"  Height="{Binding ActualHeight, ElementName=parentElementName}" Width="{Binding ActualWidth, ElementName=parentElementName}" />
            </DataTemplate>
        </Controls:MetroAnimatedTabControl.ContentTemplate>

    </Controls:MetroAnimatedTabControl>



</Grid>

TickersViewModel

private ObservableCollection<TickerViewModel> _tickers = new ObservableCollection<TickerViewModel>();
private Market _selectedMarket;

public ObservableCollection<TickerViewModel> TickersList
{
    get
    {
        return _tickers;
    }
    set
    {
        Set(ref _tickers, value);
    }
}

TickerViewModel

public class TickerViewModel : ViewModelBase
{
    public string Name { get; set; }
    public Market Market { get; set; }
    public Exchange SelectedExchange{ get; set; }
    public MarketSummary Summary { get; set; }


}

TickerView

<UserControl x:Class="V2.Views.TickerView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:V2.Views"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300"
         DataContext="{Binding Ticker, Source={StaticResource Locator}}">
<Grid>
    <StackPanel>
        <TextBlock Text="{Binding Name}"/>
    <Button Height="Auto" Margin="0,118,0,134">sdasdasdasdasdasdasdasdasdasdasdasdasdasdasdasdasda</Button>
        <TextBlock Text="{Binding Market}"/>
    </StackPanel>
</Grid>

Answer 1

ContentTemplate 应该包含 TickerView，而不是绑定到名为 TickerView:

的属性

<Controls:MetroAnimatedTabControl.ContentTemplate>
    <DataTemplate DataType="{x:Type y:TickerViewModel}">
        <local:TickerView />
    </DataTemplate>
</Controls:MetroAnimatedTabControl.ContentTemplate>

并从 TickerView 中删除这个：

DataContext="{Binding Ticker, Source={StaticResource Locator}}">

它会自动继承TabControl中对应的TickerViewModel作为它的DataContext。

MahApps TabControl 绑定

MahApps TabControl Binding

c#

wpf

data-binding

mvvm-light

mahapps.metro