user3117628
user3117628

Reputation: 786

How to get buttons above grid?

So when designing my buttons are visible when I enter them like this. However, when i run the application they're under the grid layout and it's impossible to see them or use them. How can I get them to show and be usable? Thank you

<Window x:Class="Berichtensysteem.Window1"
            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:Berichtensysteem"
            mc:Ignorable="d"
            Title="Mailclient" Height="auto" Width="auto"
            >

        <Grid Height="400" Width="600">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="67*"/>
                <ColumnDefinition Width="14*"/>
                <ColumnDefinition Width="119*"/>
            </Grid.ColumnDefinitions>
            <Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin="116,-25,0,0" VerticalAlignment="Top" Width="75"/>
            <Button x:Name="button1" Content="Button" HorizontalAlignment="Left" Margin="196,-25,0,0" VerticalAlignment="Top" Width="75" Grid.ColumnSpan="3"/>
            <TabControl TabStripPlacement="Left" Grid.ColumnSpan="3" >
                <TabItem Header="Inbox" Height="30">
                    <TabItem.Content>
                        <ListView  Name="inbox" BorderThickness="2">
                            <ListView.View >
                                <GridView>
                                    <GridViewColumn Header="Van" Width="70" DisplayMemberBinding="{Binding from}" />
                                    <GridViewColumn Header="Onderwerp" Width="120" DisplayMemberBinding="{Binding subject}" />
                                    <GridViewColumn Header="Op" Width="130" DisplayMemberBinding="{Binding time}" />
                                    <GridViewColumn Header="Content" Width="150" DisplayMemberBinding="{Binding content}" />
                                </GridView>
                            </ListView.View>
                        </ListView>
                    </TabItem.Content>
                </TabItem>
                <TabItem Header="Verzonden items" Height="30">
                    <TabItem.Content>
                        <ListView  Name="sentitems" BorderThickness="2">
                            <ListView.View>
                                <GridView>
                                    <GridViewColumn Header="From" Width="70" DisplayMemberBinding="{Binding from}" />
                                    <GridViewColumn Header="Subject" Width="120" DisplayMemberBinding="{Binding subject}" />
                                    <GridViewColumn Header="Op" Width="130" DisplayMemberBinding="{Binding time}" />
                                    <GridViewColumn Header="Content" Width="150" DisplayMemberBinding="{Binding content}" />
                                </GridView>
                            </ListView.View>
                        </ListView>
                    </TabItem.Content>
                </TabItem>
                <TabItem Header="Verwijderde Items" Height="30"
                         >
                    <TabItem.Content>
                        <ListView  Name="deleteditems" BorderThickness="2">
                            <ListView.View>
                                <GridView>
                                    <GridViewColumn Header="From" Width="70" DisplayMemberBinding="{Binding from}" />
                                    <GridViewColumn Header="Subject" Width="120" DisplayMemberBinding="{Binding subject}" />
                                    <GridViewColumn Header="Op" Width="130" DisplayMemberBinding="{Binding time}" />
                                    <GridViewColumn Header="Content" Width="150" DisplayMemberBinding="{Binding content}" />
                                </GridView>
                            </ListView.View>
                        </ListView>
                    </TabItem.Content>
                </TabItem>
            </TabControl>
        </Grid>

    </Window>

Edit: my buttons do show when i resize the window to fullscreen. So it might have something to do with my code:

        //Resize to fit content
        this.SizeToContent = SizeToContent.WidthAndHeight;

However if I don't use the above my window doesn't look as neat because there's a lot of whitespace.

Upvotes: 1

Views: 80

Answers (1)

lokusking
lokusking

Reputation: 7456

Something like this should do the trick. Notice the 2 Rows i've added. Feel free to customize the StackPanel as it fits your needs.

<Grid Height="400" Width="600">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="67*"/>
            <ColumnDefinition Width="14*"/>
            <ColumnDefinition Width="119*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>
        <StackPanel Orientation="Horizontal" Grid.ColumnSpan="3" Height="Auto" Margin="0,0,0,10">
            <Button x:Name="button" Content="Button" HorizontalAlignment="Left"  VerticalAlignment="Top" Width="75"/>
            <Button x:Name="button1" Content="Button" HorizontalAlignment="Left"  Margin="20,0,0,0" VerticalAlignment="Top" Width="75" />
        </StackPanel>

        <TabControl TabStripPlacement="Left" Grid.ColumnSpan="3" Grid.Row="1">
            <TabItem Header="Inbox" Height="30">
                <TabItem.Content>
                    <ListView  Name="inbox" BorderThickness="2">
                        <ListView.View >
                            <GridView>
                                <GridViewColumn Header="Van" Width="70" DisplayMemberBinding="{Binding from}" />
                                <GridViewColumn Header="Onderwerp" Width="120" DisplayMemberBinding="{Binding subject}" />
                                <GridViewColumn Header="Op" Width="130" DisplayMemberBinding="{Binding time}" />
                                <GridViewColumn Header="Content" Width="150" DisplayMemberBinding="{Binding content}" />
                            </GridView>
                        </ListView.View>
                    </ListView>
                </TabItem.Content>
            </TabItem>
            <TabItem Header="Verzonden items" Height="30">
                <TabItem.Content>
                    <ListView  Name="sentitems" BorderThickness="2">
                        <ListView.View>
                            <GridView>
                                <GridViewColumn Header="From" Width="70" DisplayMemberBinding="{Binding from}" />
                                <GridViewColumn Header="Subject" Width="120" DisplayMemberBinding="{Binding subject}" />
                                <GridViewColumn Header="Op" Width="130" DisplayMemberBinding="{Binding time}" />
                                <GridViewColumn Header="Content" Width="150" DisplayMemberBinding="{Binding content}" />
                            </GridView>
                        </ListView.View>
                    </ListView>
                </TabItem.Content>
            </TabItem>
            <TabItem Header="Verwijderde Items" Height="30"
                         >
                <TabItem.Content>
                    <ListView  Name="deleteditems" BorderThickness="2">
                        <ListView.View>
                            <GridView>
                                <GridViewColumn Header="From" Width="70" DisplayMemberBinding="{Binding from}" />
                                <GridViewColumn Header="Subject" Width="120" DisplayMemberBinding="{Binding subject}" />
                                <GridViewColumn Header="Op" Width="130" DisplayMemberBinding="{Binding time}" />
                                <GridViewColumn Header="Content" Width="150" DisplayMemberBinding="{Binding content}" />
                            </GridView>
                        </ListView.View>
                    </ListView>
                </TabItem.Content>
            </TabItem>
        </TabControl>
    </Grid>

Result

OutputImage

Upvotes: 1

Related Questions