I feel dumb for asking this, but how can I set a grid to use the whole space of my wpf page ? I can't seem to put its height to "*" and I'd like it to fill the whole "DesignHeight/Width" as I change them. Thank you !
<Page x:Class="Aud10.MenuHome"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d" Title="MenuHome" d:DesignHeight="860" d:DesignWidth="1196">
<Grid Height="860" Width="1196">
<Grid.RowDefinitions>
<RowDefinition Height="0.5*" />
<RowDefinition Height="0.5*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.333*" />
<ColumnDefinition Width="0.333*" />
<ColumnDefinition Width="0.333*" />
</Grid.ColumnDefinitions>
</Grid>
</Page>
Just remove the Width and Height settings altogether, then the Grid will fill up all available space automatically.
<Grid >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBlock Text="Label" Width="150" />
<TextBox Text="Value" Grid.Column="0" />
</Grid>
Related
I am new to WPF , i can't find a way to open a new WPF window on the same main WPF app
i tried Frame method , here is the code :-
<Window x:Class="WPF_FINAL.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:WPF_FINAL"
mc:Ignorable="d"
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
TextElement.Foreground="{DynamicResource MaterialDesignBody}"
TextElement.FontWeight="Regular"
TextElement.FontSize="13"
TextOptions.TextFormattingMode="Ideal"
TextOptions.TextRenderingMode="Auto"
Background="{DynamicResource MaterialDesignPaper}"
Height="768"
Width="1366"
WindowState="Maximized"
Title="MainWindow">
<Grid Background="#dff9fb"
Margin="33,10,-33,-10">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20" />
<ColumnDefinition Width="13.5" />
<ColumnDefinition Width="152" />
<ColumnDefinition Width="auto"
MinWidth="335.5" />
<ColumnDefinition />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="*" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Frame Margin="0,0,0.5,10"
Grid.ColumnSpan="5"
x:Name="main"
Grid.RowSpan="6">
</Frame>
</Grid>
</Window>
cs code
main.Content = new Window1();
but when i run it gives me break exception
i tried also navigation service but i found it's only associated with Pages
any suggestion how to do this ?
thank you
A Frame can host any content, even HTML.
The Page only exposes special helpers like the NavigationService to make navigation between pages more convenient.
A Window can not be the child of another element e.g. child of Frame. It must be the root element. By assigning the Window to Frame.Content the Frame beceomes the parent of the Window, which is illegal.
A simple solution would be to convert the Window1 class to a UserControl:
<UserControl x:Class="MyUserControl">
<TextBlock Text="TEST CONTROL" FontSize="25"/>
</UserControl>
Now your assignment will work:
main.Content = new MyUserControl();
or
main.Navigate(new MyUserControl());
or
main.Navigate("file path to/MyUserControl.xaml");
I can't make the ScrollViewer in WPF while using Caliburn Micro MVVM work! https://github.com/moon1234moon/Factures
Here is my XML code:
<ScrollViewer VerticalScrollBarVisibility="Visible"
HorizontalScrollBarVisibility="Visible">
<Grid HorizontalAlignment="Left" VerticalAlignment="Top"
MaxHeight="900"
MaxWidth="900"
>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="*" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<!-- Deleted because they are quite a lot -->
<ContentControl Grid.Column="3" Grid.Row="1" Grid.RowSpan="5"
x:Name="ActiveItem"
Margin="30, 150, 30, 30"
/>
</Grid>
</ScrollViewer>
Of-course I tried making the scroll enabled IsEnabled = true and added VerticalAlignment and HorizentalAlignment to it but non of that seemed to work!..
Please Help!! PS: The most important part is for me to be able to scroll horizontally to see the content of the ContentControl
And here is the result:
Image shows scroll to be not enabled
1) put off the command MaxHeight and MaxWidth from your view which is usercontrol
2) put off the scrollviewer of the same view and define scrollviewer in the main window (shellview i suppose). The main window contents all usercontrols
3)all will be ok
I'm using Mahapps.Metro.SimpleChildWindow to show a data input window. I would like for the entry window to be moveable. I've set "AllowMove" in my XAML markup, but the window still isn't moveable. Here is the XAML I'm using:
<UserControl x:Class="Project.Views.View"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls"
xmlns:Dialog="clr-namespace:MahApps.Metro.Controls.Dialogs;assembly=MahApps.Metro"
xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
xmlns:simpleChildWindow="clr-namespace:MahApps.Metro.SimpleChildWindow;assembly=MahApps.Metro.SimpleChildWindow"
Dialog:DialogParticipation.Register="{Binding}"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<Grid x:Name="RootGrid">
<simpleChildWindow:ChildWindow CloseByEscape="True"
ChildWindowWidth="500"
ChildWindowHeight="200"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Margin="10"
ChildWindowImage="None"
BorderBrush="{DynamicResource AccentBaseColorBrush}"
GlowBrush="{DynamicResource AccentColorBrush}"
IsModal="True"
AllowMove="True"
IsOpen="{Binding IsChildWindowOpen}"
Title="View/Edit ">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="15" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!-- Child Window Content -->
</Grid>
</simpleChildWindow:ChildWindow>
<-- Other controls and stuff -->
</Grid>
</UserControl>
I'm opening and closing the child window from the ViewModel by setting IsChildWindowOpen to true or false.
I have been looking at the examples on GitHub but the example with the moveable window is using XAML that is in an external file. I was using XAML nested in the current view so that I could bind to the current ViewModel instance.
What do I need to change to make the window moveable?
Okay, I figured it out. I needed to remove
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
HorizontalAlignment="Center"
VerticalAlignment="Center"
from the window declaration.
<simpleChildWindow:ChildWindow CloseByEscape="True"
ChildWindowWidth="500"
ChildWindowHeight="180"
Margin="10"
BorderThickness="1"
ChildWindowImage="None"
BorderBrush="{DynamicResource AccentBaseColorBrush}"
CloseOnOverlay="True"
GlowBrush="{DynamicResource AccentColorBrush}"
AllowMove="True"
IsOpen="{Binding IsChildWindowOpen}"
</simpleChildWindow:ChildWindow>
Hopefully no one else has already asked this question, but I have searched and cannot find any mention. Feel free to point me in the right direction if I missed another question that explains this.
I have a WrapPanel with data-bound items that essentially contain an icon and some variable length text (this is a legend for a chart). I really like the fact that the items appear in neat columns when I set the ItemWidth to some set value. However, due to the high variability in length of the text in each item, I cannot easily choose a specific value that will work for all cases. That is, in some cases the text for all the items might be short, so a smaller value for ItemWidth would be appropriate. But other times, such a small ItemWidth would result in truncated text among some of the items.
I figure I can data bind ItemWidth to the WrapPanel's children somehow in order to extract the width of each item (and find the maximum width, and use that as the ItemWidth, etc), but I am leery of doing so due to the potential of data binding to the wrong thing. As in, binding to something that changes when ItemWidth changes, leading to infinite loops (or at least, loops that repeat more times than necessary.
What is the best way to set this so that the ItemWidth is only as large as it needs to be to prevent truncation?
EDIT:
I want to retain the feature offered by the WrapPanel that allows there to be a variable number of columns of items, depending on the space allowed for the WrapPanel itself.
You could wrap each item in a Grid, and use the Grid's ShareSizeScope property to make sure all items share the same width.
For example, on your WrapPanel you would set Grid.IsSharedSizeScope to true
<WrapPanel Grid.IsSharedSizeScope="True">
Then you'd wrap each item in a single cell Grid that uses the SharedSizeGroup property to tell them that they all share a size
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="SharedGroup" />
</Grid.ColumnDefinitions>
<ContentPresenter />
</Grid>
If you want an example, a quick Google search gave me this answer which contains a code example.
I'd recommend performance testing this too if you have a large set of data.
Try the following. The part to pay attention to is the Grid.IsSharedSizeScope="True" on the wrap panel AND the column definition's SharedSizeGroup property.
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<WrapPanel Grid.IsSharedSizeScope="True">
<WrapPanel.Resources>
<Style TargetType="TextBlock">
<Setter Property="Padding" Value="2" />
<Setter Property="HorizontalAlignment" Value="Center" />
</Style>
</WrapPanel.Resources>
<WrapPanel.Children>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="1234567890" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="1234567890" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="1234567890" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="1234567890" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="1234567890" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="1234567890" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="group1" />
</Grid.ColumnDefinitions>
<TextBlock Text="1234567890" />
</Grid>
</WrapPanel.Children>
</WrapPanel>
</Grid>
</Window>
try setting the itemwidth property to Auto... see here:
http://msdn.microsoft.com/en-us/library/system.windows.controls.wrappanel.itemwidth(v=vs.110).aspx
to perform this "width set" programmatically, you could do the following, once the control has been rendered.
protected override void OnRender(DrawingContext dc)
{
int largest = 0;
foreach(UIElement child in this.myWrapPanel.Children)
{
if(child.Width>largest)
largest = child.Width;
}
this.myWrapPanel.ItemWidth = largest;
}
I have this Windows app:
<Window x:Class="PlayTube.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="800" Width="1400">
<Grid Background="#FFD86F6F">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Height="70" Background="#FF9A9A9A">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBox Grid.Column="1" Height="25" Width="200" Name="SearchTextBox" />
<Button Grid.Column="2" Height="25" Width="80" Content="Search" Click="Button_Click" />
</Grid>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200" MaxWidth="250" />
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="300" MaxWidth="350"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid Background="#FFFFFF89">
</Grid>
<GridSplitter HorizontalAlignment="Right"
VerticalAlignment="Stretch"
Grid.Column="1" ResizeBehavior="PreviousAndNext"
Width="5" Background="#FFBCBCBC" />
<Grid Background="#FF05BECB" Grid.Column="2">
</Grid>
<GridSplitter HorizontalAlignment="Right"
VerticalAlignment="Stretch"
Grid.Column="3" ResizeBehavior="PreviousAndNext"
Width="5" Background="#FFBCBCBC"/>
<Grid Background="#FF4E04A7" Grid.Column="4">
<MediaElement Stretch="Fill" />
</Grid>
</Grid>
</Grid>
As you can see i have 3 Grids and i want to know if it possible the every grid will be managed from a class, because i dont want that all the logic will be in this main Windows class.
Right click on your project select the Add sub menu and then select user control, you should get this dialog.
Give the control a name and click ok
build your project and look in the toolbox, you should see right at the top that the new user control you added will be there.
drag this item in to the content of your grid and it should set everything up for you.
afer doing this my window now looks like
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApplication1" x:Class="WpfApplication1.MainWindow"
Title="MainWindow" Height="350" Width="525">
<Grid>
<local:UserControl1 HorizontalAlignment="Left" Height="100" VerticalAlignment="Top" Width="100"/>
</Grid>
</Window>