RibbonCombobox Пример из MSDN работает иначе

225

02 марта 2017, 21:58

Здравствуйте!

В момент изучения Ribbon в WPF параллельно читаю MSDN, и выдернул пример по работе с Combobox, однако у меня откуда-то скроллинг отображается. Хотя пример из MSDN полный copy*past.

https://msdn.microsoft.com/en-us/library/microsoft.windows.controls.ribbon.ribboncombobox(v=vs.100).aspx

В чем причина?

Ожидаемый результат (из MSDN):

В итоге получил:

Исходный код XAML:

    <r:RibbonWindow
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:r="http://schemas.microsoft.com/winfx/2006/xaml/presentation/ribbon" x:Class="RibbonExample.MainWindow"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <r:Ribbon>
            <r:RibbonTab Header="Главная">
                <r:RibbonGroup Header="Пример">
                    <!--Начало пример MSDN-->
                    <r:RibbonComboBox Label="1" SelectionBoxWidth="62" VerticalAlignment="Center" IsEditable="True">
                        <r:RibbonGallery SelectedValue="Green" SelectedValuePath="Content" MaxColumnCount="1">
                            <r:RibbonGalleryCategory>
                                <r:RibbonGalleryItem Content="Green" Foreground="Green" />
                                <r:RibbonGalleryItem Content="Blue" Foreground="Blue" />
                                <r:RibbonGalleryItem Content="Orange" Foreground="Orange" />
                            </r:RibbonGalleryCategory>
                        </r:RibbonGallery>
                    </r:RibbonComboBox>
                    <!--Конец примера-->
                </r:RibbonGroup>
            </r:RibbonTab>
        </r:Ribbon>
    </Grid>
</r:RibbonWindow>

Еще элементы под курсором подсвечиваются только там, где есть текст, а не на полную ширину выпадающего списка.

Answer 1

Достаточно интересный вопрос касаемо примера с MSDN, и вот что получил в результате поиска решения вопроса: если набросать обычный пример, взятый с MSDN - RibbonComboBox, то действительно получаем именно то, что у Вас в результате - отображается скролл и выбранный элемент под курсором не подсвечивается на всю ширину. Эти две проблемы я смог решить так:

Чтобы убрать Scroll из выпадающего списка достаточно добавить в свойства RibbonGallery пункт, выключающий скролл:

ScrollViewer.VerticalScrollBarVisibility="Disabled"

Заметил, что ширина подсветки выбранного элемента - это максимальная ширина текста в списке. С отображением подсветки выбранного элемента на всю ширину эстетически красивого решения увы не нашел, но могу предложить два способа решения этого вопроса.

Самый простой способ - это задать ширину у одного из элементов списка:

<RibbonGalleryItem Content="Green" Foreground="Green" Width="76" />

Ну и второй способ, через задание стиля для типа RibbonGalleryItem у элемента RibbonGalleryCategory вот так:

<RibbonGalleryCategory.Resources>
    <Style TargetType="RibbonGalleryItem">
        <Setter Property="Width" Value="76"></Setter>
    </Style>
</RibbonGalleryCategory.Resources>

Какой код видим в результате у RibbonComboBox:

<RibbonComboBox 
    Label="1" 
    SelectionBoxWidth="62"
    VerticalAlignment="Center" 
    IsEditable="True">
    <RibbonGallery 
        SelectedValue="Green" 
        SelectedValuePath="Content" 
        MaxColumnCount="1"          
        ScrollViewer.VerticalScrollBarVisibility="Disabled">
        <RibbonGalleryCategory>
            <RibbonGalleryCategory.Resources>
                <Style TargetType="RibbonGalleryItem">
                    <Setter Property="Width" Value="76"></Setter>
                </Style>
            </RibbonGalleryCategory.Resources>
            <RibbonGalleryItem Content="Green" Foreground="Green" />
            <RibbonGalleryItem Content="Blue" Foreground="Blue" />
            <RibbonGalleryItem Content="Orange" Foreground="Orange" />
        </RibbonGalleryCategory>
    </RibbonGallery>
</RibbonComboBox>

Ну и соответствующее изображение, полученное на форме:

С отображением подсветки выбранного элемента на всю ширину не самое лучшее решение, думаю, можно и лучше сделать, но для наброска и временного решения вполне применимо, думаю. Что касается MSDN - не всегда то, что там есть соответствует действительности, но это бывает не часто, тем более, что этой странице уже достаточно много лет, учитывая, что это для Visual Studio 2010, может быть что-то изменилось с момента публикации страницы, вышли обновления, поменялись значения по умолчанию.