Current filter:
                                You should refresh the page.
                                  • Hello

                                    We want dxb:BarSplitButtonItem sub menu arrow towards left
                                    How can we achieve it.

                                    Thanks

                                1 Solution

                                Creation Date Importance Sort by

                                Hello Surendra,

                                BarSplitButtonItem does not provide the capability to show its button on the left side. You can try to change FlowDirection to RigthToLeft in the BarSplitButtonItemLinkControl control that is shown when you use BarSplitButtonItem:

                                [XAML]
                                <Style TargetType="dxb:BarSplitButtonItemLinkControl"> <Style.Triggers> <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=Link.Item.Tag}" Value="ChangeFlowDirection"> <Setter Property="FlowDirection" Value="RightToLeft"/> </DataTrigger> </Style.Triggers> </Style> ....  <dxb:BarSplitButtonItem Content="Search Company" Tag="ChangeFlowDirection" > <dxb:BarSplitButtonItem.PopupControl> <dxb:PopupControlContainer> <Border FlowDirection="LeftToRight" Height="200" Width="300" Background="Red" BorderBrush="Black" BorderThickness="2" > <TextBlock Text="Test"/> </Border> </dxb:PopupControlContainer> </dxb:BarSplitButtonItem.PopupControl> </dxb:BarSplitButtonItem>

                                As you can see, I change the FlowDirection in an implicit style for the BarSplitButtonItemLinkControl class only when a corresponding BarSplitButtonItem's Tag contains a certain value. I did it so that this logic is used only in certain BarSplitButtonItem. If you want to affect all items, it should be sufficient to declare this setter outside the trigger.

                                Thanks,
                                Andrey

                                • Surendra Lal 1 08.21.2019

                                  Thanks for the answer. Have a doubt
                                  We have a space between arrow and text
                                  How do we remove it

                                • Surendra Lal 1 08.21.2019

                                                      <dxb:BarSubItem Alignment="Far" Glyph="pack://application:,,,/Assets/Images/wheel.png"
                                                                  BarItemDisplayMode="ContentAndGlyph" GlyphAlignment="Right"
                                                                          dxb:BarManager.ShowGlyphsInPopupMenus="False">

                                                          <dxb:BarSplitButtonItem Content="Super Theme" ArrowAlignment="Left" BarItemDisplayMode="Content" Name="ChangeFlowDirection">
                                                              <dxb:BarSplitButtonItem.PopupControl>
                                                                  <dxb:PopupMenu IgnoreMenuDropAlignment="true" Placement="Left">
                                                                      <dxb:PopupMenu.Items>
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeDXStyle" Content="DXStyle "
                                                                             Tag="DXStyle" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeOffice2016Colorful" Content="Office2016Colorful "
                                                                             Tag="Office2016Colorful" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeOffice2013" Content="Office2013 "
                                                                             Tag="Office2013" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeOffice2013DarkGray" Content="Office2013DarkGray "
                                                                             Tag="Office2013DarkGray" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeOffice2013LightGray" Content="Office2013LightGray "
                                                                             Tag="Office2013LightGray" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeOffice2010Blue" Content="Office2010Blue "
                                                                             Tag="Office2010Blue" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeOffice2010Silver" Content="Office2010Silver "
                                                                             Tag="Office2010Silver" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeVS2010" Content="VS2010 "
                                                                             Tag="VS2010" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeOffice2007Blue" Content="Office2007Blue "
                                                                             Tag="Office2007Blue" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeOffice2007Silver" Content="Office2007Silver "
                                                                             Tag="Office2007Silver" ItemClick="OnMenuBarItemThemeClick" />
                                                                          <dxb:BarButtonItem x:Name="ThemeThemeLightGray" Content="LightGray "
                                                                             Tag="LightGray" ItemClick="OnMenuBarItemThemeClick" />
                                                                      </dxb:PopupMenu.Items>
                                                                  </dxb:PopupMenu>
                                                              </dxb:BarSplitButtonItem.PopupControl>
                                                          </dxb:BarSplitButtonItem>

                                                          <dxb:BarButtonItem x:Name="Profile" Content="Profile" Tag="Spine.Views.Windows.UserAccounts.UserProfileView"
                                                                             ItemClick="OnMenuBarSubItemClick" ToolTip="Profile" />
                                                          <dxb:BarButtonItem x:Name="changepassword" Content="Change Password"  ToolTip="Change Password"
                                                                             Tag="Spine.Views.Windows.UserAccounts.PasswordResetView" ItemClick="OnMenuBarSubItemClick" />
                                                          <dxb:BarButtonItem x:Name="LogOff" Content="Log Off" Command="{Binding LoginCommand}"  ToolTip="Log Off" />
                                                          </dxb:BarSubItem>
                                                      </dxb:MainMenuControl>

                                          <Style TargetType="dxb:BarSplitButtonItemLinkControl">
                                              <Style.Triggers>
                                                  <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=Link.Item.Name}" Value="ChangeFlowDirection">
                                                      <Setter Property="FlowDirection" Value="RightToLeft"/>
                                                  </DataTrigger>

                                • Dima (DevExpress Support) 08.21.2019

                                  Hello Surendra,

                                  This behavior occurs because all sub items of BarSubItem are horizontally center-aligned. When you change FlowDirection for one of them, you see the opposite behavior. You can add a HorizontalAligment setter with the Left value to your BarSplitButtonItemLinkControl style to resolve this issue.

                                  Please try this approach and let me know your result.