Настроить комбинированный компонент Silverlight

Question

Это (должен быть) простой вопрос.Я хотел бы создать такой компонент, как кнопка уведомления Facebook (поэтому, если вы щелкнете по ней, появится выпадающее меню, и появится значок с номером непрочитанного уведомления).

Я подумал настроитькомпонент комбинированного окна по умолчанию (он имеет всплывающее окно и кнопку переключения), удалив текстовое поле и стрелку внутри кнопки переключения и добавив кнопку переключения внутри холста, чтобы я мог абсолютно точно расположить значок.

Итак ... Я хочу "экспортировать" некоторые основные функции и возможность еще более стильно оформить компонент (например, установить шаблон для кнопки-переключателя, для значка и для каждого элемента в списке).

Я не могу найти, как мне этого добиться ... создать "первый" уровень стиля, чтобы люди, использующие мой компонент, не знали, что это комбинированное окно, но вместо этого они могут установить мои свойства(например, «ButtonContent», «NotificationItem» и «Badge»)…

Спасибо.Francesco

Answer 1

Я решил не стилизовать поле со списком, но создать новый компонент (сильно вдохновленный списком)

<UserControl x:Class="silverlight.Components.Notification.View.NotificationSummary"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
             xmlns:sys="clr-namespace:System;assembly=mscorlib"
             xmlns:conv="clr-namespace:silverlight.ViewModel.Converters"
    mc:Ignorable="d"
    d:DesignHeight="25" d:DesignWidth="100">

    <StackPanel x:Name="LayoutRoot">
        <StackPanel.Resources>
            <conv:NumberToVisibilityConverter x:Key="HasUnreadEventsConverter" />
        </StackPanel.Resources>

        <ToggleButton x:Name="eventButton" Click="notificationButtonClicked">
            <ToggleButton.Content>
                <StackPanel Orientation="Horizontal">
                    <Border Padding="5 3" VerticalAlignment="Center" HorizontalAlignment="Left">
                        <ContentPresenter x:Name="buttonContent" />
                    </Border>
                    <Border x:Name="badge" Padding="5 2" CornerRadius="5" Margin="0 0 5 0"
                                HorizontalAlignment="Right" VerticalAlignment="Center"
                                BorderThickness="1"
                            Visibility="{Binding numberOfUnreadEvents, Converter={StaticResource HasUnreadEventsConverter}}">
                        <Border.BorderBrush>
                            <SolidColorBrush Color="Black" />
                        </Border.BorderBrush>
                        <Border.Background>
                            <SolidColorBrush Color="Red"/>
                        </Border.Background>
                        <TextBlock x:Name="badgeText" Text="{Binding numberOfUnreadEvents}"/>
                    </Border>
                </StackPanel>
            </ToggleButton.Content>
        </ToggleButton>

        <Popup IsOpen="{Binding ElementName=eventButton, Path=IsChecked}" x:Name="notificationPopup">
            <Border x:Name="popupBorder" Background="White" CornerRadius="0 0 5 5"
                    Padding="5">
                <Border.Effect>
                    <DropShadowEffect BlurRadius="5" Direction="315" ShadowDepth="5" Color="Black" />
                </Border.Effect>
                <ListBox x:Name="eventsList" ItemsSource="{Binding events}"
                         IsHitTestVisible="False">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <ContentPresenter x:Name="itemTemplate" />
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </Border>
        </Popup>
    </StackPanel>
</UserControl>

Answer 2

Если вы не возражаете платить за сторонние компоненты, всегда есть RadControls для Silverlight от Telerik .Комплект содержит RadDropDownButton control , который, я думаю, должен делать именно то, что вам нужно.