Hello I am currently using library Mahapps but I have some problems. How can I pop out the flyout when clicking the "Menu 1" MenuItem? I tried with the following code but it did not work.
<ListBox.ContextMenu>
<ContextMenu>
<MenuItem x:Name="FlyoutOverview" Header="Menu 1" IsCheckable="True" Click="flyoutOverview">
<MenuItem.Icon>
<iconPacks:PackIconModern Kind="GlobeWire"/>
</MenuItem.Icon>
</MenuItem>
<Separator/>
<MenuItem Header="Menu 2"/>
<Separator/>
<MenuItem Header="Menu 3">
<MenuItem.Icon>
<iconPacks:PackIconModern Kind="People"/>
</MenuItem.Icon>
</MenuItem>
<MenuItem Header="Menu 4">
<MenuItem.Icon>
<iconPacks:PackIconModern Kind="UserDelete"/>
</MenuItem.Icon>
</MenuItem>
<MenuItem Header="Menu 5">
<MenuItem.Icon>
<iconPacks:PackIconModern Kind="ControlResume"/>
</MenuItem.Icon>
</MenuItem>
</ContextMenu>
</ListBox.ContextMenu>
</ListBox>
If you have followed the tutorial links I provided then I suppose you are able to create a simple View and its ViewModel.
The View can be a Window and has its Grid content like this:
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Controls:FlyoutsControl Grid.Column="1">
<Controls:Flyout x:Name="yourMahAppFlyout" Header="Flyout" Background="AliceBlue" Position="Right" Width="350"
IsOpen="{Binding ElementName=FlyoutOverview, Path=IsChecked}">
<TextBlock Text="My Flyout is here" />
</Controls:Flyout>
</Controls:FlyoutsControl>
<ListBox Grid.Row="0" Grid.Column="0" ItemsSource="{Binding NameList}">
<ListBox.ContextMenu>
<ContextMenu>
<MenuItem x:Name="FlyoutOverview" Header="Menu 1" IsCheckable="True"
IsChecked="{Binding IsMenuItem1Checked}">
<MenuItem.Icon>
<iconPacks:PackIconModern Kind="GlobeWire"/>
</MenuItem.Icon>
</MenuItem>
<Separator/>
<MenuItem Header="Menu 2"/>
<Separator/>
<MenuItem Header="Menu 3">
<MenuItem.Icon>
<iconPacks:PackIconModern Kind="People"/>
</MenuItem.Icon>
</MenuItem>
<MenuItem Header="Menu 4">
<MenuItem.Icon>
<iconPacks:PackIconModern Kind="UserDelete"/>
</MenuItem.Icon>
</MenuItem>
<MenuItem Header="Menu 5">
<MenuItem.Icon>
<iconPacks:PackIconModern Kind="ControlResume"/>
</MenuItem.Icon>
</MenuItem>
</ContextMenu>
</ListBox.ContextMenu>
</ListBox>
</Grid>
The ViewModel can have these properties:
public MainWindowViewModel()
{
NameList = new ObservableCollection<string>()
{
"John", "Micheal", "Jack"
};
}
public ObservableCollection<string> NameList { get; set; }
public bool IsMenuItem1Checked
{
get { return _isMenuItem1Checked; }
set { SetProperty(ref _isMenuItem1Checked, value); }
}
The first menu item in the listbox binds its "IsChecked" property to "IsMenuItem1Checked" in ViewModel, and FlyOut "IsOpen" property binds to "IsChecked" of that menu item.
Related
I am trying to build application which has some pictures drawn on buttons. Application looks nice on Windows 7 - as expected, although on Windows 10 it looks differently.
Despite Defined width and height size, image is truncated.
Uploaded screens:
1: Windows 7 vs. Windows 10
2: Windows 7 vs. Windows 10
]2
<Menu x:Name="menu" HorizontalAlignment="Stretch" Height="25" Margin="0,0,0,0" VerticalAlignment="Center" Width="Auto" DockPanel.Dock="Top">
<MenuItem Header="_Soubor" Height="25" HorizontalAlignment="Center" VerticalAlignment="Center">
<MenuItem Click="NewCalculation_Click">
<MenuItem.Header>
<TextBlock Text="_Nová kalkulace" VerticalAlignment="Center"/>
</MenuItem.Header>
<MenuItem.Icon>
<Image Source="graphics/icons/new.ico" Height="35" Width="35" />
</MenuItem.Icon>
</MenuItem>
<Separator/>
<MenuItem Click="saveCalculation_Click">
<MenuItem.Header>
<TextBlock Text="Uložit kalkulaci" VerticalAlignment="Center"></TextBlock>
</MenuItem.Header>
<MenuItem.Icon>
<Image Source="graphics/icons/save.ico" Height="35" Width="35" />
</MenuItem.Icon>
</MenuItem>
<MenuItem Click="LoadCalculation_Click">
<MenuItem.Header>
<TextBlock Text="Načíst kalkulaci" VerticalAlignment="Center"></TextBlock>
</MenuItem.Header>
<MenuItem.Icon>
<Image Source="graphics/icons/load.ico" Height="35" Width="35" />
</MenuItem.Icon>
</MenuItem>
<Separator/>
<MenuItem Click="createReport_Click">
<MenuItem.Header >
<TextBlock Text="Vytvoř report" VerticalAlignment="Center"></TextBlock>
</MenuItem.Header>
<MenuItem.Icon>
<Image Source="graphics/icons/report.ico" Height="35" Width="35" />
</MenuItem.Icon>
</MenuItem>
<Separator/>
<MenuItem Click="endApp_Click">
<MenuItem.Header>
<TextBlock Text="Konec" VerticalAlignment="Center"></TextBlock>
</MenuItem.Header>
<MenuItem.Icon>
<Image Source="graphics/icons/close.ico" Height="35" Width="35" />
</MenuItem.Icon>
</MenuItem>
</MenuItem>
<MenuItem Header="_Nastavení" Height="25" HorizontalAlignment="Center" VerticalAlignment="Center">
<MenuItem x:Name="MenuSqlSetting" Header="_Připojení na SQL server" Click="MenuSqlSetting_Click"/>
</MenuItem>
<MenuItem Header="_O aplikaci" Click="MenuItem_Click" />
</Menu>
Code for second screen:
<Button x:Name="buttonRemove" Grid.Column="1" Margin="2,0,0,0" IsEnabled="False" Click="buttonRemove_Click" Background="White">
<StackPanel>
<Image Source="Graphics/remove.png" Width="50" Height="50"/>
</StackPanel>
</Button>
Thanks for any advice.
You should check this article before trying anything. It's all about the theme difference between win 7 and win 10.
https://arbel.net/2006/11/03/forcing-wpf-to-use-a-specific-windows-theme/
There is another workaround from Visual Studio.
You click with the mouse on the MenuItem and you look at the Template in the Property Inspector under the Miscellaneous group.
Then you "Convert to New Resource..."
see the image
so you will get the corresponding xaml transformed as
<MenuItem Command="{Binding YourCmd}" Header="Your Header"
Template="{DynamicResource MenuItemControlTemplate1}" >
Then you can build on your Windows 7 machine and deploy to Windows 10 without such issue.
The icons in my menu are showing in the design view but not at runtime.
Why?
I have tried both with and without pack://application :,,,
<Window x:Class="Aurora4XHelper.MainWindow"
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:local="clr-namespace:Aurora4XHelper"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="550">
<Grid Name="grid_Main">
<Menu IsMainMenu="True" x:Name="menu" DockPanel.Dock="Top" HorizontalAlignment="Left" Height="auto" VerticalAlignment="Top" Width="{Binding ElementName=grid_Main,Path=ActualWidth}">
<MenuItem Header="File">
<MenuItem Header="Exit" >
<MenuItem.Icon>
<Image Source="/Aurora4XHelper;component/Resources/Icons/Exit.png" />
</MenuItem.Icon>
</MenuItem>
</MenuItem>
<MenuItem Header="Design">
<MenuItem Header="Missile">
<MenuItem Header="Missile">
<MenuItem.Icon>
<Image Source="pack://application :,,,/Aurora4XHelper;component/Resources/Icons/Missile.png" />
</MenuItem.Icon>
</MenuItem>
<MenuItem Header="MIRV" />
<MenuItem Header="Bouy" />
<MenuItem Header="Mine" />
</MenuItem>
<MenuItem Header="Sensor" />
<MenuItem Header="Ship" />
<MenuItem Header="Terraforming"/>
</MenuItem>
</Menu>
</Grid>
Try to remove the /Aurora4XHelper;component/ part and just put <Image Source="Resources/Icons/Exit.png" /> instead.
Also make sure the BuildAction of the png file is set to Resource.
I want to create sub-contextmenu for Filters in my datagrid. How can I do that? Here is my code:
<DataGrid x:Name="DataGridSuppliers" Margin="10" ItemsSource="{Binding}" IsReadOnly="True" >
<DataGrid.ContextMenu>
<ContextMenu>
<MenuItem Header="Create Supplier" Click="btnCreateSupplier_Click" />
<MenuItem Header="Edit Supplier" Click="btnEditSupplier_Click" />
<MenuItem Header="Filters" />
</ContextMenu>
</DataGrid.ContextMenu>
</DataGrid>
Create nested sub menuItems inside Filters, that's all what you want:
<ContextMenu>
<MenuItem Header="Create Supplier" Click="btnCreateSupplier_Click"/>
<MenuItem Header="Edit Supplier" Click="btnEditSupplier_Click"/>
<MenuItem Header="Filters">
<MenuItem Header="Sub Filter 1"/>
<MenuItem Header="Sub Filter 2"/>
<MenuItem Header="Sub Filter 3"/>
</MenuItem>
</ContextMenu>
I have a panel withing a WindowsFormHost in a WPF app. Eventually i need to be able to click and draw points. I had it working fully in a separate WinForm form... but for some reason the paint event won't fire at all when Invalidate() is called! The click event is definitely firing as the message box comes up on the click. Not a peep out of the paint even though. Can't figure out why for the life of me... here's the code.
XML:
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
Title="MainWindow" Height="1000" Width="1000"
WindowState="Maximized" SizeChanged="Window_SizeChanged" LocationChanged="Window_LocationChanged" Background="Gray">
<DockPanel LastChildFill="True">
<ToolBarTray DockPanel.Dock="Top">
<ToolBar Width="Auto" HorizontalAlignment="Stretch">
<Menu>
<MenuItem Header="File" VerticalAlignment="Center">
<MenuItem Header="New" Click="MenuItem_Click_3" />
<MenuItem Header="Open" Click="MenuItem_Click_4"/>
<MenuItem Header="Open Recent">
<MenuItem Header="Some Recent Files"/>
</MenuItem>
<MenuItem Header="Import H2OFate File" Click="MenuItem_Click_7"/>
<Separator/>
<MenuItem Header="Save" Click="MenuItem_Click_1" />
<MenuItem Header="Save As" Click="MenuItem_Click_5"/>
<MenuItem Header="Save without Results"/>
<MenuItem Header="Delete Unnecessary Files"/>
<Separator/>
<MenuItem Header="File Options"/>
<Separator/>
<MenuItem Header="Project Info"/>
<MenuItem Header="Supply Info" />
<Separator/>
<MenuItem Header="Print" Click="MenuItem_Click_6" />
<Separator/>
<MenuItem Header="Reload Current File"/>
<MenuItem Header="Exit CTRL+Q" Click="MenuItem_Click"/>
</MenuItem>
<MenuItem Header="Network Design" VerticalAlignment="Center">
<MenuItem Header="Something" Click="MenuItem_Click_8"/>
</MenuItem>
<MenuItem Header="Run Analysis" VerticalAlignment="Center">
<MenuItem Header="Run" Click="MenuItem_Click_2"/>
</MenuItem>
<MenuItem Header="View Results" VerticalAlignment="Center">
<MenuItem Header="Numeric"/>
<MenuItem Header="X-Y Plots"/>
<MenuItem Header="Contours"/>
<MenuItem Header="Reports"/>
</MenuItem>
<MenuItem Header="Facilities Management" VerticalAlignment="Center">
<MenuItem Header="Some Item"/>
<MenuItem Header="Hydraulics"/>
<MenuItem Header="Contamination"/>
<MenuItem Header="Sensor Placement"/>
</MenuItem>
<MenuItem Header="Tools/Databases" VerticalAlignment="Center">
<MenuItem Header="Some Item"/>
<MenuItem Header="Hydraulics"/>
<MenuItem Header="Contamination"/>
<MenuItem Header="Sensor Placement"/>
</MenuItem>
<MenuItem Header="Help" VerticalAlignment="Center">
<MenuItem Header="Some Item"/>
<MenuItem Header="Help"/>
<MenuItem Header="Units"/>
<MenuItem Header="Demo Examples"/>
<MenuItem Header="Tutorial"/>
<MenuItem Header="How To"/>
<MenuItem Header="About"/>
</MenuItem>
</Menu>
</ToolBar>
<ToolBar>
<Button Height="38" Width ="50" VerticalAlignment="Center" Click="Button_Click_1">
<Ellipse Width="25" Height="25" Fill="Blue" Stroke="Black" VerticalAlignment="Center"/>
</Button >
<Button Height="38" Width ="50" VerticalAlignment="Center" Click="Button_Click_1">
<Rectangle Width="38" Fill="Red" Height="7" Stroke="Black"/>
</Button >
<Button Height="38" Width ="50" VerticalAlignment="Center" Click="Button_Click_2">
<Polygon Fill="Yellow" Stroke="Black" Points="0,10 30,10 30,0 28,0 28,3 2,3 2,0 0,0" VerticalAlignment="Center"/>
</Button >
<Button Height="38" Width ="50" VerticalAlignment="Center" Click="Button_Click_3">
<Polygon Stroke="Black" Fill="Green" VerticalAlignment="Center" Points="22,0 22,7 15,7 15,15 9,15 9,7 0,7 0,0 "/>
</Button >
</ToolBar>
</ToolBarTray>
<TabControl Width ="1000" DockPanel.Dock="Left">
<TabItem Header="Map">
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
</Grid.RowDefinitions>
<WindowsFormsHost Grid.Row="0" x:Name="wfPanel" >
<WindowsFormsHost.Child>
<wf:Panel x:Name="wfSurface" MouseClick="wfSurface_MouseClick"/>
</WindowsFormsHost.Child>
</WindowsFormsHost>
</Grid>
</TabItem>
<TabItem Header="Map Settings">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="250"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Button Content="Testing 123"/>
</Grid>
</TabItem>
</TabControl>
<TabControl DockPanel.Dock="Right">
</TabControl>
</DockPanel>
C#
private void wfSurface_Paint(object sender, System.Windows.Forms.PaintEventArgs e)
{
Graphics g;
g = wfSurface.CreateGraphics();
epanet epa = epanet.GetInstance();
SolidBrush s = new SolidBrush(System.Drawing.Color.Blue);
g.FillEllipse(s, Convert.ToInt32(epa.xCord), Convert.ToInt32(epa.yCord), 50, 50);
g.FillEllipse(s, 400, 400, 500, 500);
MessageBox.Show("paint event fired");
}
private void wfSurface_MouseClick(object sender, System.Windows.Forms.MouseEventArgs e)
{
epanet epa = epanet.GetInstance();
epa.xCord = e.X;
epa.yCord = e.Y;
MessageBox.Show("xCord is: " + e.X.ToString());
wfSurface.Invalidate();
}
Edit:
And to further check that the paint event is the issue I added the line g.FillEllipse(s,400,400,400,400); into the click event and it successfully drew the ellipse.
Not much of a WPF guy, but my guess would be to add this:
<WindowsFormsHost.Child>
<wf:Panel x:Name="wfSurface" Paint="wfSurface_Paint"
MouseClick="wfSurface_MouseClick"/>
</WindowsFormsHost.Child>
I'm working with a WPF menu and unfortunately whenever I go to set an Icon in Visual Studio designer I receive an exception error.
To work around this I'm trying to set the icon with XAML code, I have the following:
<Menu Height="23" Name="menu1" VerticalAlignment="Top" BorderThickness="0" SnapsToDevicePixels="True" OverridesDefaultStyle="False" Opacity="1">
<MenuItem Header="Help">
<MenuItem Header="About">
<Image Source="Images/Help.png" />
</MenuItem>
</MenuItem>
</Menu>
Unfortunately this creates the following scenario:
I've tried googling the issue but can't see where my XAML has gone wrong. I know this is simple, but I'm stuck!
Is this what you want?
<Menu Height="23" Name="menu1" VerticalAlignment="Top" BorderThickness="0" SnapsToDevicePixels="True" OverridesDefaultStyle="False" Opacity="1">
<MenuItem Header="Help">
<MenuItem Header="About">
<MenuItem.Icon>
<Image Source="Images/Help.png" />
</MenuItem.Icon>
</MenuItem>
</MenuItem>
</Menu>
do you want something like this?
<Menu Height="23" Name="menu1" VerticalAlignment="Top" BorderThickness="0" SnapsToDevicePixels="True" OverridesDefaultStyle="False" Opacity="1">
<MenuItem Header="Help">
<MenuItem>
<MenuItem.Header>
<StackPanel>
<Image Source="Images/Help.png" />
<TextBlock Text="About" />
</StackPanel>
</MenuItem.Header>
</MenuItem>
</MenuItem>
</Menu>