Can not create my own DropDownCommandButton

Developer
Mar 12, 2014 at 9:04 PM
When I try to create a dropdown command button, I am able to see the icon in the designer but once I build the project, it only shows a white circle here is my code
<Geometry x:Key="AccountsGeometry">F1M38,19C43.5417,19 45.9167,22.1667 45.1174,28.8134 45.8315,29.2229 46.3125,29.9928 46.3125,30.875 46.3125,31.9545 45.5923,32.8658 44.6061,33.1546 44.1941,34.623 43.5543,35.9229 42.75,36.9628L42.75,41.9583C45.3889,42.4861 47.5,42.75 50.6667,44.3333 53.8333,45.9167 54.8889,47.3681 57,49.4792L57,57 19,57 19,49.4792C21.1111,47.3681 22.1667,45.9167 25.3333,44.3333 28.5,42.75 30.6111,42.4861 33.25,41.9583L33.25,36.9628C32.4457,35.9229 31.8059,34.623 31.3939,33.1546 30.4077,32.8658 29.6875,31.9545 29.6875,30.875 29.6875,29.9928 30.1685,29.2229 30.8826,28.8134 30.0833,22.1667 32.4583,19 38,19z M35.2292,44.3333L36.8125,47.5 39.1875,47.5 40.7708,44.3333 35.2292,44.3333z M36.4167,49.0833L38,55.4167 39.5833,49.0833 36.4167,49.0833z</Geometry>
    
 <Style x:Key="AccountDropDownCommandButtonStyle" BasedOn="{StaticResource DropDownCommandButtonBase}" TargetType="{x:Type metro:DropDownCommandButton}">
        <Setter Property="Content" Value="{StaticResource AccountLargeIconContentControlStyle}"/>
        <Setter Property="Header" Value="Accounts"/>
    </Style>
    <Style x:Key="AccountLargeIconContentControlStyle" BasedOn="{StaticResource LargeIconContentControlStyle}" TargetType="{x:Type ContentControl}">
        <Setter Property="Content" Value="{StaticResource AccountsGeometry}"/>
    </Style>
Then in the MainWindow, I used the Export Button you have in the demo as a reference but switched the style to my own like so
            <metro:DropDownCommandButton HorizontalAlignment="Center"
                                         Margin="{Binding RelativeSource={RelativeSource Self}, Path=(params:General.BoldPadding), Mode=OneWay}"
                                         Style="{StaticResource AccountDropDownCommandButtonStyle}">
                <metro:DropDownCommandButton.Submenu>
                    <metro:Submenu>
                        <MenuItem Style="{StaticResource ExportMenuItemStyle}"/>
                        <MenuItem Style="{StaticResource ExportCsvMenuItemStyle}"/>
                        <MenuItem Style="{StaticResource PdfMenuItemStyle}"/>
                        <MenuItem Style="{StaticResource ExcelMenuItemStyle}"/>
                        <MenuItem Style="{StaticResource WordMenuItemStyle}"/>
                        <MenuItem Style="{StaticResource OutlookMenuItemStyle}"/>
                        <MenuItem Style="{StaticResource PowerPointMenuItemStyle}"/>
                    </metro:Submenu>
                </metro:DropDownCommandButton.Submenu>
            </metro:DropDownCommandButton>

Coordinator
Mar 21, 2014 at 4:49 PM
Hi,

I think you have your styles in the wrong order. I tried this code and all works fine:
<Grid>
            <Grid.Resources>
                <Geometry x:Key="AccountsGeometry">F1M38,19C43.5417,19 45.9167,22.1667 45.1174,28.8134 45.8315,29.2229 46.3125,29.9928 46.3125,30.875 46.3125,31.9545 45.5923,32.8658 44.6061,33.1546 44.1941,34.623 43.5543,35.9229 42.75,36.9628L42.75,41.9583C45.3889,42.4861 47.5,42.75 50.6667,44.3333 53.8333,45.9167 54.8889,47.3681 57,49.4792L57,57 19,57 19,49.4792C21.1111,47.3681 22.1667,45.9167 25.3333,44.3333 28.5,42.75 30.6111,42.4861 33.25,41.9583L33.25,36.9628C32.4457,35.9229 31.8059,34.623 31.3939,33.1546 30.4077,32.8658 29.6875,31.9545 29.6875,30.875 29.6875,29.9928 30.1685,29.2229 30.8826,28.8134 30.0833,22.1667 32.4583,19 38,19z M35.2292,44.3333L36.8125,47.5 39.1875,47.5 40.7708,44.3333 35.2292,44.3333z M36.4167,49.0833L38,55.4167 39.5833,49.0833 36.4167,49.0833z</Geometry>
                <Style x:Key="AccountLargeIconContentControlStyle" BasedOn="{StaticResource LargeIconContentControlStyle}" TargetType="{x:Type ContentControl}">
                    <Setter Property="Content" Value="{StaticResource AccountsGeometry}"/>
                </Style>
                <Style x:Key="AccountDropDownCommandButtonStyle" BasedOn="{StaticResource DropDownCommandButtonBase}" TargetType="{x:Type metro:DropDownCommandButton}">
                    <Setter Property="Content" Value="{StaticResource AccountLargeIconContentControlStyle}"/>
                    <Setter Property="Header" Value="Accounts"/>
                </Style>
            </Grid.Resources>

            <StackPanel>
                <metro:DropDownCommandButton Margin="{Binding RelativeSource={RelativeSource Self}, Path=(params:General.BoldPadding), Mode=OneWay}"
                                             Style="{StaticResource AccountDropDownCommandButtonStyle}">
                    <metro:DropDownCommandButton.Submenu>
                        <metro:Submenu>
                            <MenuItem Style="{StaticResource ExportMenuItemStyle}"/>
                            <MenuItem Style="{StaticResource ExportCsvMenuItemStyle}"/>
                            <MenuItem Style="{StaticResource PdfMenuItemStyle}"/>
                            <MenuItem Style="{StaticResource ExcelMenuItemStyle}"/>
                            <MenuItem Style="{StaticResource WordMenuItemStyle}"/>
                            <MenuItem Style="{StaticResource OutlookMenuItemStyle}"/>
                            <MenuItem Style="{StaticResource PowerPointMenuItemStyle}"/>
                        </metro:Submenu>
                    </metro:DropDownCommandButton.Submenu>
                </metro:DropDownCommandButton>
            </StackPanel>


        </Grid>
Marked as answer by rehansaeed on 1/2/2015 at 2:13 AM
Coordinator
Mar 21, 2014 at 4:50 PM
By the way, you are the first person to post a question and one of only eight people to have downloaded this SDK so far. Open source is pretty cool.