C#•3y ago

✅ How to style menu bar??? avalonia

I have figured out how to style the menu bar itself, and style the items in the menu bar, however, I cannot figure out how to style the parts that are white. I have also tried to style the pointerover portion of the MenuItem when the user hovers over the menu, but it's not working either. It's supposed to have a charcoal background, blue font no matter what it happening with it.

<!-- Inside Style File -->
<Style Selector="Menu.menu">
  <Setter Property="BorderBrush" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="BorderThickness" Value="1" />
  <Setter Property="Margin" Value="5,0,5,0" />
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
</Style>

<Style Selector="MenuItem.menuItem">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
</Style>

<Style Selector="MenuItem.innerMenuItem">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="Background" Value="{DynamicResource ResourceKey=Charcoal}" />
</Style>

<Style Selector="MenuItem.innerMenuItem:pointerover">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="Background" Value="{DynamicResource ResourceKey=Charcoal}" />
</Style>
<!-- MenuItem Code in main file -->
<Menu Classes="menu" DockPanel.Dock="Top">
  <MenuItem Classes="menuItem" Header="_Help">
    <MenuItem Classes="innerMenuItem" Header="_FAQ" />
    <Separator />
    <MenuItem Classes="innerMenuItem" Header="_Exit" />
  </MenuItem>
</Menu>

<!-- Inside Style File -->
<Style Selector="Menu.menu">
  <Setter Property="BorderBrush" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="BorderThickness" Value="1" />
  <Setter Property="Margin" Value="5,0,5,0" />
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
</Style>

<Style Selector="MenuItem.menuItem">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
</Style>

<Style Selector="MenuItem.innerMenuItem">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="Background" Value="{DynamicResource ResourceKey=Charcoal}" />
</Style>

<Style Selector="MenuItem.innerMenuItem:pointerover">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="Background" Value="{DynamicResource ResourceKey=Charcoal}" />
</Style>
<!-- MenuItem Code in main file -->
<Menu Classes="menu" DockPanel.Dock="Top">
  <MenuItem Classes="menuItem" Header="_Help">
    <MenuItem Classes="innerMenuItem" Header="_FAQ" />
    <Separator />
    <MenuItem Classes="innerMenuItem" Header="_Exit" />
  </MenuItem>
</Menu>

<!-- Inside Style File -->
<Style Selector="Menu.menu">
  <Setter Property="BorderBrush" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="BorderThickness" Value="1" />
  <Setter Property="Margin" Value="5,0,5,0" />
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
</Style>

<Style Selector="MenuItem.menuItem">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
</Style>

<Style Selector="MenuItem.innerMenuItem">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="Background" Value="{DynamicResource ResourceKey=Charcoal}" />
</Style>

<Style Selector="MenuItem.innerMenuItem:pointerover">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="Background" Value="{DynamicResource ResourceKey=Charcoal}" />
</Style>
<!-- MenuItem Code in main file -->
<Menu Classes="menu" DockPanel.Dock="Top">
  <MenuItem Classes="menuItem" Header="_Help">
    <MenuItem Classes="innerMenuItem" Header="_FAQ" />
    <Separator />
    <MenuItem Classes="innerMenuItem" Header="_Exit" />
  </MenuItem>
</Menu>

<!-- Inside Style File -->
<Style Selector="Menu.menu">
  <Setter Property="BorderBrush" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="BorderThickness" Value="1" />
  <Setter Property="Margin" Value="5,0,5,0" />
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
</Style>

<Style Selector="MenuItem.menuItem">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
</Style>

<Style Selector="MenuItem.innerMenuItem">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="Background" Value="{DynamicResource ResourceKey=Charcoal}" />
</Style>

<Style Selector="MenuItem.innerMenuItem:pointerover">
  <Setter Property="Foreground" Value="{DynamicResource ResourceKey=LightBlue}" />
  <Setter Property="Background" Value="{DynamicResource ResourceKey=Charcoal}" />
</Style>
<!-- MenuItem Code in main file -->
<Menu Classes="menu" DockPanel.Dock="Top">
  <MenuItem Classes="menuItem" Header="_Help">
    <MenuItem Classes="innerMenuItem" Header="_FAQ" />
    <Separator />
    <MenuItem Classes="innerMenuItem" Header="_Exit" />
  </MenuItem>
</Menu>

I have also tried giving a Classes name to the separator and styling it, but that changed nothing as well. Thanks in advance.

✅ How to style menu bar??? avalonia

Similar Threads

Similar Threads

Similar Threads