WPF Skalowanie kontrolek wraz z zmianą rozmiarów okna

Witam.
Dwa dni temu byłem zmuszony przenieść swój projekt fikcyjnej gazowni z C# Winforms na WPF. Program robię na zaliczenie laboratoriów na których profesor oświadczył, że jest klientem i nie zna się na porgramowaniu, więc od tego jak wizualnie spodoba mu się GUI zależy zaliczenie. :)

Pogrupowałem wszystko na siatce grid w kilku pustych komórkach pojawią się jeszcze rysunki, zastanawiam się natomiast jak zrobić aby przy powiększaniu okienka wszystkie kontrolki powiększały się proporcjonalnie razem z nim, jak na razie tylko rozmieszenie kontrolek zachowuje proporcje. Zmiana rozmiaru manometru na Auto zaowocowała tylko przesunięciem kontrolki względem x,y środka komórki w której się znajduje.

Próbowałem z google ale się nie udało. Za pomoc z góry dziękuje.

Edit. W podglądzie screen wyświetla się poprawnie.

Na wszelki wypadek dołączam projekt w załączniku.

Mój kod wpf:

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:WPF="clr-namespace:Codeplex.Dashboarding.WPF;assembly=Codeplex.Dashboarding.WPF" x:Class="WpfApplication1.MainWindow"
        
        Title="MainWindow" Width="768" Height="621.567" ResizeMode="CanResizeWithGrip">
    <Grid x:Name="grid1" RenderTransformOrigin="1,1" Margin="0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="87*" />
            <ColumnDefinition Width="87*"/>
            <ColumnDefinition Width="174*" />
            <ColumnDefinition Width="85*" />
            <ColumnDefinition Width="89*"/>

        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="204*"/>
            <RowDefinition Height="141*"/>
            <RowDefinition Height="85*"/>
            <RowDefinition Height="45*"/>
            <RowDefinition Height="41*"/>
            <RowDefinition Height="87*"/>
            <RowDefinition Height="46*"/>
            <RowDefinition Height="42*"/>
        </Grid.RowDefinitions>

        <WPF:WallThermometer Name="Termo1" Grid.Column="3" Grid.ColumnSpan="2" Grid.Row="1" Grid.RowSpan="2" HorizontalAlignment="Center"  VerticalAlignment="Center" Minimum="273" Maximum="373" />
        <WPF:WallThermometer Name="Termo2" Grid.Column="3" Grid.ColumnSpan="2" Grid.Row="0"  HorizontalAlignment="Center"  VerticalAlignment="Center" Maximum="373" Minimum="273" />

        <WPF:Dial360         Name="Manometr" Grid.Column="0" Grid.ColumnSpan="2" Minimum="1300" Maximum="1400" RenderTransformOrigin="0.5,0.5" Width="165" Height="165" VerticalAlignment="Center" HorizontalAlignment="Center" >
              </WPF:Dial360>

        <Canvas Name="Zbiornik" Grid.Row="0" Grid.RowSpan="8"  Grid.Column="2" VerticalAlignment="Center" Height="0" Background="Black" HorizontalAlignment="Center"   />
        <Canvas Name="Chlodzenie" Grid.Row="1" Grid.RowSpan="2" Grid.Column="0" Grid.ColumnSpan="2" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5"   />
        <Canvas Name="ZaworD"  Grid.Row="4" Grid.RowSpan="2" Grid.Column="0" Grid.ColumnSpan="2" HorizontalAlignment="Center" VerticalAlignment="Center" >

        </Canvas>
        <Canvas Name="ZaworW"  Grid.Row="4" Grid.RowSpan="2" Grid.Column="3" Grid.ColumnSpan="2" HorizontalAlignment="Center" VerticalAlignment="Center" />


        <Button Content="Chłodzenie" HorizontalAlignment="center"  Grid.Row="3" VerticalAlignment="Center" Width="96" Height="25" Click="Button_Click"/>
        <Button Content="Odwadnianie" Grid.Column="3" HorizontalAlignment="center" Grid.Row="3" VerticalAlignment="Center" Width="94" Height="25" Click="Button_Click_1"/>
        <Button Content="Wyjście" Grid.Column="4" HorizontalAlignment="center"  Grid.Row="7" VerticalAlignment="Center" Width="99" Height="22" Click="Button_Click_2"/>

        <Label x:Name="LblChlodzenie" Content="Wyłączony" Grid.Column="1" HorizontalAlignment="center"  Grid.Row="3" VerticalAlignment="Center" Height="30" Width="97"/>
        <Slider Name="SLZaworD" Height="26" Width="96" Grid.Row="6" ValueChanged="Slider_ValueChanged" Maximum="100" Background="{x:Null}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        <Label Name="LblWPulapDachu" Content="Label" Grid.Column="0" Grid.Row="7" HorizontalAlignment="Center" VerticalAlignment="Center" />

        <Label Name="LblWCisGazu" Content="Label" Grid.Column="1"  Grid.Row="7" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        <Slider Name ="SLZaworW" HorizontalAlignment="center"  VerticalAlignment="Center" Height="26" Width="94" Grid.Row="6" Grid.Column="3" ValueChanged="Slider_ValueChanged_1" Maximum="100"/>

        <Label x:Name="LblZaworD" Content="0" Grid.Column="1" HorizontalAlignment="center"  Grid.Row="6" VerticalAlignment="Center" Width="97" Height="26"/>
        <Label x:Name="LblZaworW" Content="0" Grid.Column="4" HorizontalAlignment="Center"  Grid.Row="6" VerticalAlignment="Center" Height="26" Width="99"/>

    </Grid>
</Window>

Edit. Pracuje w VisualStudio 2012

Możesz zawsze zablokować możliwość powiększania. ;)

Z ViewBoxem może lepiej podejść indywidualnie do kontrolek, które chcesz powiększyć, np zrób tak z Dial360:

<Viewbox Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" Grid.RowSpan="2" Stretch="Uniform">
 <WPF:Dial360  Name="Manometr" Minimum="1300" Maximum="1400" />
</Viewbox>

Jeśli GUI ma się podobać do zaliczenia to jeszcze nad nim popracuj, bo na razie nie powala. :-P

dodaj Storyboard i szpanowskie animacje.

Swoją droga dziwny wykładowca, dał byś mu coś we Flashu i też byś zaliczył :)

Obecnie konstrukcja wygląda w taki sposób pseudokod: Viebox(Grid(... ViewBox(kontrolka)...). Wszystko jest proporcjonalnie ale bardzie niż ja tego chciałem, mianowicie np. Manometr po powiększeniu ekranu nie zachował własnych proporcji z koła zrobiło się jajo. W jaki sposób wprowadzić jakieś ograniczenia dla każdej z kontrolek aby zachowały dodatkowo własne proporcje?
Pragnę uzyskać efekt identyczny na obu rodzajach monitorów przy maxymalizacj.

Edit. Działam na monitorze panoramicznym.

Vanguard1990 napisał(a):

Viebox(Grid(... ViewBox(kontrolka)...).

Przeczytaj to: http://msdn.microsoft.com/pl-pl/library/system.windows.media.stretch.aspx

Poza tym nie rozumiem po co jeszcze ViewBox nad głównym Gridem. Nie lepiej go usunąć? Grid sam rozszerza/zwęża swoje wiersze i kolumny w zależności powierzchni okna przy powiększeniu. No chyba, że nie do końca zrozumiałem Twoje intencje i chcesz żeby wszystko w aplikacji, łączeni z labelami, sliderami i buttonami się skalowało (o_O), wtedy faktycznie jeden ViewBox powinien wystarczyć (czyli. bez dodatkowych w środku ).

<marudzenie>podstawowe operacje w WPF urastają do rangi kilkudniowych problemów...</marudzenie>

Azarien napisał(a):

<marudzenie>podstawowe operacje w WPF urastają do rangi kilkudniowych problemów...</marudzenie>

Jakie tam problemy tworzysz Grida dodajesz kolumny i wiersze ustawiasz wysokość/szerokość używając "*"/"Auto", kontrolkom nie wpisujesz na sztywno wysokości i szerokości i problem z głowy. Przynajmniej tak to chyba było. :D

DibbyDum napisał(a):

Jakie tam problemy tworzysz Grida dodajesz kolumny i wiersze ustawiasz wysokość/szerokość używając "*"/"Auto", kontrolkom nie wpisujesz na sztywno wysokości i szerokości i problem z głowy. Przynajmniej tak to chyba było. :D

OK. Tylko, że te kontrolki z Codeplexa, które są w tym projekcie używane mają na sztywno ustawione rozmiary przez ich twórców. Więc dla osoby bez dużego doświadczenia pozostaje użycie ViewBoxa.

Udało się :) jeszcze tylko rysunki.

Rozdzielczość 1024

Struktura kodu:

<main window="window" s/h="s/h" auto="auto"> <grid s/h="s/h" auto="auto"> <viewbox> kontrolka bez s/h </viewbox> <viewbox> ........... < /viewbox> </grid> </window>