Question

过去两天我花了很多时间来控制这个控制，我被困住了。基本上我不怎么数据模板它的RibbonTab。如果它只在RibbonTab的底部显示，我所拥有的将对我有用！儿！

我在XAML中拥有的是：

        <r:Ribbon Grid.Row="0" Title="MSRibbon" x:Name="ribbon">
            <r:Ribbon.Style>
                <Style TargetType="{x:Type r:Ribbon}">
                    <Setter Property="TabHeaderTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <TextBlock Text="{Binding Header}" HorizontalAlignment="Center" VerticalAlignment="Center" />
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="ItemsSource" Value="{Binding AvailableRibbonTabs}"/>
                    <Setter Property="SelectedItem" Value="{Binding SelectedRibbonTab}"/>
                    <Setter Property="ItemContainerStyle">
                        <Setter.Value>
                            <Style TargetType="{x:Type r:RibbonTab}">
                                <Setter Property="ItemsSource" Value="{Binding RibbonTabData}"/>
                            </Style>
                        </Setter.Value>
                    </Setter>
                </Style>
            </r:Ribbon.Style>
            <r:Ribbon.Resources>
                <DataTemplate DataType="{x:Type vmsrc:RecordingRibbonTabGroupData}">
                    <viewsrc:RecordingTabGroupControl/>
                </DataTemplate>
            </r:Ribbon.Resources>
        </r:Ribbon>

我希望在功能区选项卡组中显示的控件的XAML（显示时会粘贴到功能区选项卡的底部）：

<r:RibbonControl x:Class="Scanner.Views.RecordingRibbonTabGroupData">
    <StackPanel Orientation="Horizontal">
    <r:RibbonButton Label="foo" />
    <r:RibbonButton Label="bar" />
    <ListBox ItemsSource="{Binding Barcodes}" />
    </StackPanel>
</r:RibbonControl>

这里我尝试使用不同的控件组合，但没有效果。作为控件基类型，我使用了RibbonTab，RibbonGroup，UserControl等，我认为我使用了所有可能的控件作为主容器，如StackPanel，Grid，ItemsControl等。还尝试设置每个控件的高度和H / V对齐等没什么帮助。

我的视图模型是这样的（INPC注入INPCWeaver并且它可以工作）：

public abstract class AbstractViewModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;
}

public abstract class AbstractRibbonTab : AbstractViewModel
{
    public string Header { get; set; }
    public bool IsSelected { get; set; }

    public ObservableCollection<AbstractRibbonTabGroupData> RibbonTabData { get; set; }
}



public class RecordingRibbonTab : AbstractRibbonTab
{
    public RecordingRibbonTab()
    {
        this.Header = "Recording";
        this.RibbonTabData = new ObservableCollection<AbstractRibbonTabGroupData>() { new RecordingRibbonTabGroupData() };
    }
}

public class SessionRibbonTab : AbstractRibbonTab
{
    public SessionRibbonTab()
    {
        this.Header = "Session";
        this.RibbonTabData = new ObservableCollection<AbstractRibbonTabGroupData>() { new AbstractRibbonTabGroupData() };
    }
}

public class SettingsRibbonTab : AbstractRibbonTab
{
    public SettingsRibbonTab()
    {
        this.Header = "Settings";
        this.RibbonTabData = new ObservableCollection<AbstractRibbonTabGroupData>() { new AbstractRibbonTabGroupData() };
    }
}

XAML将其数据上下文设置为以下实例：

public class MainWindowViewModel : AbstractViewModel, IMainWindowViewModel
{
    ...
    public ObservableCollection<AbstractRibbonTab> AvailableRibbonTabs { get; private set; }
    public AbstractRibbonTab SelectedRibbonTab { get; set; }
    ...
    public MainWindowViewModel(PinChangeCommand pcc)
    {
        this.AvailableRibbonTabs = new ObservableCollection<AbstractRibbonTab>();
        this.AvailableRibbonTabs.Add(new RecordingRibbonTab());
        this.AvailableRibbonTabs.Add(new SessionRibbonTab());
        this.AvailableRibbonTabs.Add(new SettingsRibbonTab());
    }
 }

绑定有效。

作为旁注，在功能区下方有一个如此声明的内容控件

        <ContentControl Grid.Row="1" Content="{Binding SelectedRibbonTab}">
            <ContentControl.Resources>
                <DataTemplate DataType="{x:Type vmsr:RecordingRibbonTab}">
                    <views:RecordingView />
                </DataTemplate>
            </ContentControl.Resources>
        </ContentControl>

正如人们所期望的那样完美无缺。

我实现的“录制”视图具有以下XAML（它只显示标题，如下面的屏幕截图所示）：

<UserControl x:Class="Scanner.Views.RecordingView">
    <Grid>
        <TextBlock Text="{Binding Header}" />
    </Grid>
</UserControl>

总结一下，应该解释一些奇怪数字的代码清单：

public class RecordingRibbonTabGroupData : AbstractRibbonTabGroupData
{
    public ObservableCollection<string> Barcodes { get; private set; }

    public RecordingRibbonTabGroupData()
    {
        this.Barcodes = new ObservableCollection<string>();
        this.Barcodes.Add("76765535642");
        this.Barcodes.Add("43435356");
    }
}

没有DataTemplate： Without DataTemplate

使用DataTemplate： WITH DataTemplate

Answer 1

你需要的是两个ItemContainerStyle

 <Ribbon:Ribbon ItemContainerStyle="{StaticResource RibbonTabStyle}" ItemsSource="{Binding DummyRibbonTabContent}">

第一

<Style TargetType="{x:Type Ribbon:RibbonTab}" x:Key="RibbonTabStyle">
    <Setter Property="ItemsSource" Value="{Binding DummyRibbonGroups}" />
    <Setter Property="ItemContainerStyle" Value="{DynamicResource RibbonGroupStyle}" />
    <Setter Property="Header" Value="{Binding DummyRibbonHeader"} />
</Style>

第二

<Style TargetType="{x:Type Ribbon:RibbonGroup}" x:Key="RibbonGroupStyle">
    <Setter Property="Header" Value="{Binding RibbonGroupHeader}" />
    <Setter Property="ItemsSource" Value="{Binding DummyRibbonButtons}" />
    <Setter Property="ItemTemplate" Value="{DynamicResource RibbonButtonTemplate}" />
</Style>

显然你必须创建一个功能区按钮datatemplate。你也可以使用项目templateselector作为ribbongroupstyle，然后你不仅可以添加带状按钮，还可以添加任何你想要的。它不是你需要的确切解决方案，但我希望你能得到这个想法。

WPF功能区 - RibbonTab中的数据模板

1 个答案: