displaying listbox in grid

Question

This might be a stupid question, but i'm stuck doing it :(. I have a grid and have 3 columns. I have a textbox and a listbox in each of these 3 columns as shown:

<Grid.ColumnDefinitions>
                <ColumnDefinition Width="130"></ColumnDefinition>
                <ColumnDefinition Width="380"></ColumnDefinition>
                <ColumnDefinition Width="146"></ColumnDefinition>
             </Grid.ColumnDefinitions>

            <Grid.RowDefinitions>
                <RowDefinition Height="30"></RowDefinition>
            </Grid.RowDefinitions>
            <StackPanel Grid.Column="0" Grid.Row="0">
                <TextBox Text="File Name" Height="30"></TextBox>
            </StackPanel>
            <StackPanel Grid.Column="1" Grid.Row="0">
                <TextBox Text="File Path" Height="30"></TextBox>
            </StackPanel>
            <StackPanel Grid.Column="2" Grid.Row="0">
                <TextBox Text="File Size" Height="30"></TextBox>
            </StackPanel>

            <StackPanel Grid.Column="0">
                <ListBox Name="listbox_name" Margin="1,30" Height="276" />
             </StackPanel>
            <StackPanel Grid.Column="1">
                <ListBox Name="listbox_path" Margin="1,30" Height="276" />
            </StackPanel>
            <StackPanel Grid.Column="2">
                <ListBox Name="listbox_size" Margin="1,30" Height="276" />
            </StackPanel>

and the code behind it:

public Window1()
        {
        InitializeComponent();

        list.Add("D:\\a\\hy");
        list.Add("D:\\a\\hy1");
        list.Sort();           
    }

    private void Window_Loaded(object sender, RoutedEventArgs e)
    {
        listbox_name.ItemsSource = list;
        grid1.Visibility = Visibility.Hidden;
    }


    private void button1_Click(object sender, RoutedEventArgs e)
    {
        grid1.Visibility = Visibility.Visible;
    }

But on the click of the button, im not able to see the listboxes, with the list displayed. Please guide me as to where im going wrong. Thanks!

Answer 1

The reason is that your stackPanel is in Grid.Col="0" and it is very small. But ListBox is inside of your stackPanel. It has a margin and it goes down. Is you can't see your listBox.

If you will do something like this:

<StackPanel Margin="0,0,0,-279">
            <ListBox Name="listbox_name" Margin="1,30" Height="276" />
        </StackPanel>

you will see your listBox and it will work.
NOTE: this code is only example. You need to make a better layout for your window.

Here is how i made a window loyout:

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="678" Loaded="Window_Loaded">
    <Grid Name="grid1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="130"></ColumnDefinition>
            <ColumnDefinition Width="380"></ColumnDefinition>
            <ColumnDefinition Width="146"></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Grid.RowDefinitions>
            <RowDefinition Height="30"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>

        <TextBlock Text="File Name"  Grid.Row="0" Grid.Column="0" Margin="5" />
        <TextBlock Text="File Path"  Grid.Row="0" Grid.Column="1" Margin="5" />
        <TextBlock Text="File Size" Grid.Row="0" Grid.Column="2" Margin="5" />

        <ListBox Name="listbox_name" Grid.Row="1" Grid.Column="0" BorderBrush="Black" />
        <ListBox Name="listbox_path" Grid.Row="1" Grid.Column="1" BorderBrush="Black" />
        <ListBox Name="listbox_size" Grid.Row="1" Grid.Column="2" BorderBrush="Black" />
    </Grid>
</Window>