Search code examples
c#windows-phone-8stackpanel

Stackpanel: Black background on wp8


I have one problem - my stackpanel is vey big and it breaks(background color is changed to black).. What should i do to improve it?

<Grid x:Name="LayoutRoot" Background="#FF2D2D2D" >
    <Grid.RowDefinitions>
        <RowDefinition Height="60"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <StackPanel x:Name="TitlePanel" Orientation="Horizontal" Grid.Row="0">
    ..
    </StackPanel>

    <ScrollViewer Name="viewer" Grid.Row="1" >
        <StackPanel Name="ContentGrid" Canvas.ZIndex="1" Margin="0, 0,0,80" Background="White"  Width="452">

            <Image Name="ImageImage"  Height="300" VerticalAlignment="Top"/>
            <TextBlock  Name="DateText" TextWrapping="Wrap" TextAlignment="Center" FontSize="18" Foreground="Black"/>
            <TextBlock Name="TitleText"  TextWrapping="Wrap"  FontSize="20" TextAlignment="Center" Foreground="Black" Margin="10,0"/>
            <TextBlock TextWrapping="Wrap"  Margin="10,15,10,2" Name="DescroptionText"  FontSize="23" Foreground="#FF494949" FontFamily="Portable User Interface"/>
            <TextBlock TextWrapping="Wrap" TextTrimming="WordEllipsis"  Margin="10,0,10,2" Name="DescroptionText2"  FontSize="23" Foreground="#FF494949"/>
            <ListBox SelectionChanged="GridImages_SelectionChanged"  ScrollViewer.VerticalScrollBarVisibility="Disabled" Name="GridImages" ItemTemplate="{StaticResource AttachmentsItemTemlate}" Grid.RowSpan="2" FontFamily="Portable User Interface" >
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <toolkit:WrapPanel Orientation="Horizontal" FlowDirection="LeftToRight"  ItemWidth="150" ItemHeight="150"/>
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>
            </ListBox>
        </StackPanel>
    </ScrollViewer>
</Grid>

Solution

  • There is a limitation of 2048px in Windows Phone UIElements.

    You should try to break your different elements into smaller elements (for example: you could put several stackpanels inside the first one).

    In TextBox elements there is a workaround explained here.