• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1148
  • Last Modified:

Silverlight Expander Adjust Grid

I am trying to have a tab control that fills the entire width of the browser and an expander on teh right hand side. When expanded it would push the tab control over so it does not just go on top of the tab control.  I have reviewed many samples but cant see what I am missing.
<navigation:Page x:Class="Dashboard.Page1" 
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
                 xmlns:ig="http://schemas.infragistics.com/xaml"
                 xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
           xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
           xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                   xmlns:controlsToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
                     xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls" 
                     xmlns:igGrid="http://schemas.infragistics.com/xaml" 
           mc:Ignorable="d"
           xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           d:DesignWidth="640" d:DesignHeight="480"
           Title="MO Page">

    <Grid x:Name="LayoutRoot">
        <controlsToolkit:BusyIndicator x:Name="cmd_isbusy" Content="" Margin="0,36,0,-3" />
        <Button x:Name="cmd_parameters" HorizontalAlignment="Left" Margin="8,8,0,0" VerticalAlignment="Top" Width="130" Content="Change Parameters" Click="cmd_parameters_Click"/>
        <Button x:Name="cmd_dashboard" Margin="0,8,8,0" VerticalAlignment="Top" Content="Back To Dashboard Selection" HorizontalAlignment="Right" Width="180" Click="cmd_dashboard_Click"/>
        <Grid ShowGridLines="True" x:Name="TemplateArea_" Background="Transparent">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Grid Grid.Row="0">
                <Grid x:Name="ContentArea_" >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Grid x:Name="DataGridArea_" Margin="0" Background="Transparent" Grid.Column="0" >
                        <controls:TabControl Name="MOTabControl" Margin="0,37,0,0">
                            <controls:TabItem Header="MO HDR" Name="MoHdrTab">
                                <Grid>
                                    
                                </Grid>
                            </controls:TabItem>
                            <controls:TabItem Header="MO Planning Data" Name="MoHdrPlanning">
                            </controls:TabItem>
                            <controls:TabItem Header="MO Allocations" Name="MoHdrAllocations">
                                                      </controls:TabItem>
                            <controls:TabItem Header="MO Serial / Lot" Name="MoHdrSerialLot">
                            </controls:TabItem>
                        </controls:TabControl>
                    </Grid>
                    <controlsToolkit:Expander HorizontalContentAlignment="Left" ExpandDirection="Left" IsExpanded="True" Margin="452,36,0,0" Width="185" HorizontalAlignment="Right" Name="moexpander" Grid.Column="1">
                        <controlsToolkit:Expander.Header>
                            <TextBlock Margin="-158,0,-153,0" VerticalAlignment="Top" Text="Available MO's" TextWrapping="Wrap" Foreground="#FFE1B3B3" RenderTransformOrigin="0.5,0.5"
Grid.ColumnSpan="1" HorizontalAlignment="Center" Width="189" Height="20" d:LayoutOverrides="Height" Grid.Column="0">
<TextBlock.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="-90"/>
<TranslateTransform/>
</TransformGroup>
</TextBlock.RenderTransform>
                            </TextBlock>

                        </controlsToolkit:Expander.Header>
                        <controlsToolkit:Expander.Content>
                            <ListBox x:Name="lstmonumbers" ItemsSource="{Binding molookup}"  HorizontalContentAlignment="Left" Width="159" HorizontalAlignment="Right">
                                <ListBox.ItemTemplate>
                                    <DataTemplate>
                                        <sdk:Label Content="{Binding MO_ID}" />
                                    </DataTemplate>
                                </ListBox.ItemTemplate>
                            </ListBox>
                        </controlsToolkit:Expander.Content>
                    </controlsToolkit:Expander>
                </Grid>
            </Grid>
        </Grid>
    </Grid>
</navigation:Page>

Open in new window

0
jimseiwert
Asked:
jimseiwert
1 Solution
 
politexCommented:
Hi,  you just need to set for DataGridArea_   HorizontalAlignment="Stretch", working sample:
<UserControl xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"  x:Class="SilverlightApplication1.MainPage"
    xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"  
    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:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" 
    >
    <Grid >
        <Grid.ColumnDefinitions >
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
        </Grid.ColumnDefinitions>
    
        <Grid toolkit:DockPanel.Dock="Left"  HorizontalAlignment="Stretch" Grid.Column="0"  Background="Green">
            <sdk:TabControl >
                <sdk:TabItem Header="111"></sdk:TabItem>
                <sdk:TabItem Header="222"></sdk:TabItem>
                <sdk:TabItem Header="333"></sdk:TabItem>
                <sdk:TabItem Header="444"></sdk:TabItem>
                <sdk:TabItem Header="555"></sdk:TabItem>
            </sdk:TabControl>
        </Grid>


        <toolkit:Expander toolkit:DockPanel.Dock="Right" Grid.Column="1"  ExpandDirection="Left" >
            <toolkit:Expander.Header>
                <TextBlock>Header</TextBlock>
            </toolkit:Expander.Header>
            <toolkit:Expander.Content>
                <data:DataGrid Width="250" Background="Red"></data:DataGrid>
            </toolkit:Expander.Content>
        </toolkit:Expander>
</Grid>
</UserControl>

Open in new window

0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now