Hilfe beim Expander

  • WPF

Es gibt 6 Antworten in diesem Thema. Der letzte Beitrag () ist von Julius.

    Hilfe beim Expander

    Huhu,

    ich bin gerade mit einem Projekt beschäftigt, jedoch komme ich gerade nicht mehr weiter.

    Hier mal ein vereinfachtes Bild:

    -blauer Kreis = Expander
    -Schwarz = Fenster
    -Grau = Grid
    -innerer schwarzer Rahmen = Grid des Expanders
    - Rot = StackPanel

    In dem StackPanel habe ich meine Close/Maximize/Minimize Buttons und möchte gerne dort einen Expander hinzufügen, jedoch soll mit einem Klick auf diesen, das zum Expander dazugehörige Grid (Auf dem Bild der blaue Rahmen) öffnen.
    Meine Frage jetzt: Wie stelle ich das am besten an ?

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von „Julius“ ()

    Hallo,
    wenn der innere schwarze und der blaue Rahmen in der gleichen Höhe liegen, dann kannst du diese vielleicht in ein Grid packen und dieses in den Expander legen. Alternativ kannst du das Collapsed- bzw. Expanded-Event abfangen und entsprechend das blaue Grid anzeigen/ausblenden. Mein Favorit ist allerdings eine Datenbindung im blauen Grid an den Expander. Ein erdachtes Beispiel dazu:

    XML-Quellcode

    1. <Grid>
    2. <Grid.Resources>
    3. <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
    4. </Grid.Resources>
    5. <Grid.ColumnDefinitions>
    6. <ColumnDefinition Width="232*"/>
    7. <ColumnDefinition Width="285*"/>
    8. </Grid.ColumnDefinitions>
    9. <Expander Header="Expander" HorizontalAlignment="Left" Margin="85,52,0,0" VerticalAlignment="Top" Name="exp">
    10. <Grid Background="#FFE5E5E5"/>
    11. </Expander>
    12. <Grid Grid.Column="1" HorizontalAlignment="Left" Height="100" Margin="53,52,0,0" VerticalAlignment="Top" Width="100" Background="#FFD100FF"
    13. Visibility="{Binding IsExpanded, Converter={StaticResource BooleanToVisibilityConverter}, ElementName=exp}"/>
    14. </Grid>
    Das momentane Problem ist jetzt nur, dass ich im Window SizeToContent="Width" aktiviert habe, sodass sich "eigentlich", wenn der Expander gedrückt wird, sich das Hauptfenster vergrößert, was auch problemlos funktioniert, jedoch nicht, wenn ich die Visible-Eigenschaft vom Grid von hidden/collapsed auf visible umstelle.
    Also bei funktioniert es:

    XML-Quellcode

    1. <Window x:Class="WpfApplication129.MainWindow"
    2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    4. Title="MainWindow" SizeToContent="Width">
    5. <Grid>
    6. <Grid.Resources>
    7. <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
    8. </Grid.Resources>
    9. <Grid.ColumnDefinitions>
    10. <ColumnDefinition Width="Auto"/>
    11. <ColumnDefinition Width="Auto"/>
    12. </Grid.ColumnDefinitions>
    13. <Expander Header="Expander" VerticalAlignment="Top" Name="exp" Width="200">
    14. <Grid Background="Blue" Height="100"/>
    15. </Expander>
    16. <Grid Grid.Column="1" Margin="0,22,1,1" Width="40" Background="#FFD100FF"
    17. Visibility="{Binding IsExpanded, Converter={StaticResource BooleanToVisibilityConverter}, ElementName=exp}"/>
    18. </Grid>
    19. </Window>


    Wie sieht denn dein bisheriger Code aus?

    XML-Quellcode

    1. <Window x:Class="MainWindow"
    2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    4. Title="MainWindow" Height="200" Width="200" WindowStyle="None" AllowsTransparency="True" SizeToContent="Width">
    5. <WindowChrome.WindowChrome>
    6. <WindowChrome ResizeBorderThickness="8,8,8,8" CaptionHeight="28"/>
    7. </WindowChrome.WindowChrome>
    8. <Grid>
    9. <DockPanel Margin="0,0,0,83" Height="33" VerticalAlignment="Bottom">
    10. <Expander Header="Expander" Height="39" VerticalAlignment="Top" DockPanel.Dock="Bottom" x:Name="exp"/>
    11. </DockPanel>
    12. <StackPanel HorizontalAlignment="Left" Height="68" Margin="10,122,0,0" VerticalAlignment="Top" Width="180" Orientation="Horizontal">
    13. <Button Content="Button" Width="75"/>
    14. <Grid>
    15. <!--Hier soll später ein ganzer Haufen von Controls rein, der jedoch nur sichtbar ist, wenn der Expander ausgeklappt ist.
    16. Zudem ist SizeToContent="Width" aktiviert, damit sich die Form vergrößert, wenn ein Control rausragt-->
    17. </Grid>
    18. </StackPanel>
    19. </Grid>
    20. </Window>
    Wenn du das Grid ausklappen willst, wo der Kommentar drin ist, dann wird das wohl nicht so ohne weiteres gehen, da es ziehmlich tief verschachtelt liegt. Außerdem kann der Inhalt des Expanders nicht breiter sein als der Expander selbst.
    Wenn du dagegen ein Grid in Höhe des Expanders anlegst, ist es relativ einfach:

    XML-Quellcode

    1. <Window x:Class="MainWindow"
    2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    4. Title="MainWindow" Height="200" Width="200" WindowStyle="None" AllowsTransparency="True" SizeToContent="Width">
    5. <WindowChrome.WindowChrome>
    6. <WindowChrome ResizeBorderThickness="8,8,8,8" CaptionHeight="28"/>
    7. </WindowChrome.WindowChrome>
    8. <Grid>
    9. <Grid.Resources>
    10. <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
    11. </Grid.Resources>
    12. <Grid.ColumnDefinitions>
    13. <ColumnDefinition Width="22*"/>
    14. <ColumnDefinition Width="Auto"/>
    15. </Grid.ColumnDefinitions>
    16. <DockPanel Margin="0,0,0,83" Height="33" VerticalAlignment="Bottom">
    17. <Expander Header="Expander" Height="39" VerticalAlignment="Top" DockPanel.Dock="Bottom" x:Name="exp"/>
    18. </DockPanel>
    19. <StackPanel HorizontalAlignment="Left" Height="68" Margin="10,122,0,0" VerticalAlignment="Top" Width="180" Orientation="Horizontal" Grid.ColumnSpan="2"><!--Inhalt gekürtzt--></StackPanel>
    20. <!-- Das ist jetzt das Grid, was am Rand auftaucht. Du kannst auch eine Feste Größe zuweisen -->
    21. <Grid Grid.Column="1" Background="Magenta"
    22. Visibility="{Binding IsExpanded, Converter={StaticResource BooleanToVisibilityConverter}, ElementName=exp}">
    23. <StackPanel Orientation="Vertical">
    24. <Button Content="X"/>
    25. <Button Content="Y"/>
    26. <Button Content="Z"/>
    27. </StackPanel>
    28. </Grid>
    29. </Grid>
    30. </Window>