3
\$\begingroup\$

I currently have this code:

<Window x:Class="Listener.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="600" Width="800" Loaded="Window_Loaded" WindowStyle="None" AllowsTransparency="True" Background="Transparent" MouseDown="Window_MouseDown" KeyDown="Window_KeyDown" ResizeMode="CanResizeWithGrip">
    <Grid Margin="30" x:Name="bgBorder">
        <Grid Margin="0" Background="#555555" x:Name="mainWindow" MouseDown="mainWindow_MouseDown">
            <Grid Margin="2,2,2,2" Height="80" Background="#779999" x:Name="topControl" VerticalAlignment="Top">
            </Grid>
            <Grid Margin="2,84,238,2" Background="#557777" x:Name="playListControl">
            </Grid>
            <Grid Margin="2,84,2,2" Width="234" Background="#668888" x:Name="optionsControl" HorizontalAlignment="Right">
            </Grid>
        </Grid>
    </Grid>
</Window>

A borderless window where the 3 sub panels get resized according to their margin and alignment.

Is this the correct way of doing this?

And on a side node, I plan on creating some sort of border resize and not use

ResizeMode="CanResizeWithGrip"

This was just used for testing.

\$\endgroup\$
5
\$\begingroup\$

I would say no. If you want to create grid-like layout, you should declare columns and rows, and specify how wpf should stretch those. For example like this:

<Grid Margin="30" x:Name="bgBorder">
    <Grid Background="#555555" x:Name="mainWindow" MouseDown="mainWindow_MouseDown">
        <Grid.RowDefinitions>
            <!-- frist row will stretch to fit the content -->
            <RowDefinition Height="Auto"/>
            <!-- second row will fill all available space -->
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid Margin="2" Grid.Row="0" Height="80" Background="#779999" x:Name="topControl"/>
        <Grid Grid.Row="1">
            <Grid.ColumnDefinitions>
                <!-- first column will fill all available space -->
                <ColumnDefinition Width="*"/>
                <!-- second column will stretch to fit the content -->
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>

            <Grid Grid.Column="0" Margin="2" Background="#557777" x:Name="playListControl"/>
            <Grid Grid.Column="1" Margin="2" Width="234" Background="#668888" x:Name="optionsControl"/>
        </Grid>
    </Grid>
</Grid>

You should really do some reading on how things are done in wpf, this HTML-ish layout you are trying to create won't work.

\$\endgroup\$
  • \$\begingroup\$ Well it is working, but yea i will use this. \$\endgroup\$ – Vajura Jan 23 '15 at 6:10
3
\$\begingroup\$

İf You Use a ViewBox and a Canvas on your user control, this will fix all the mainwindow sizes.

<Viewbox xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Stretch="Uniform">
  <canvas>
       --- all your controls -- 
   </Canvas>
</Viewbox>
\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.