Why doesn’t the "Landscape" position resize the Longlistselector?

Asked

Viewed 185 times

4

Why when I put the phone in the Landscape position, the LongListSelectordoes not resize?

Follow the image:

Landscape

Follows my XAML

<Grid x:Name="ContentPanel" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center">
        <phone:LongListSelector Name="lstConsPais"  HorizontalAlignment="Stretch" VerticalAlignment="Stretch" LayoutMode="List" IsGroupingEnabled="False" SelectionChanged="lstConsPais_SelectionChanged">
            <phone:LongListSelector.ItemTemplate>
                <DataTemplate>
                    <Border BorderBrush="#222" Margin="0, 10, 0, 0" BorderThickness="0,0,0,2" Width="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                        <StackPanel VerticalAlignment="Center" Orientation="Horizontal" Width="Auto">
                            <Image Height="100" Width="100"  Source="{Binding NomeImgBandeira}" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                            <StackPanel Orientation="Vertical" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <TextBlock Text="{Binding NomePais}" Style="{StaticResource PhoneTextGroupHeaderStyle}" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="15,25,0,0" />
                            </StackPanel>
                        </StackPanel>
                    </Border>
                </DataTemplate>
            </phone:LongListSelector.ItemTemplate>
        </phone:LongListSelector>
    </Grid>

When I take the width the list no longer appears:

inserir a descrição da imagem aqui

I wanted him to fill the whole screen.

1 answer

1


It would be a way to change the screen settings:

Automatic medium:

<ScrollViewer x:Name="ContentGrid" Grid.Row="1" VerticalScrollBarVisibility="Auto">
    <!--You must apply a background to the StackPanel control or you
    will be unable to pan the contents.-->
    <StackPanel Background="Transparent" >
        <!--Adding various controls and UI elements.-->
        <Button Content="This is a Button" />
        <Rectangle Width="100" Height="100" Margin="12,0"
            HorizontalAlignment="Left" Fill="{StaticResource PhoneAccentBrush}"/>
        <Rectangle Width="100" Height="100" HorizontalAlignment="Center"
            Fill="{StaticResource PhoneAccentBrush}"/>
        <Rectangle Width="100" Height="100" Margin="12,0"
            HorizontalAlignment="Right" Fill="{StaticResource PhoneAccentBrush}"/>
        <TextBlock Text="This is a line of text that will wrap in portrait
            orientation but not landscape orientation." TextWrapping="Wrap" />
        <CheckBox Content="A CheckBox"/>
        <RadioButton Content="A RadioButton" />
    </StackPanel>
</ScrollViewer> 

inserir a descrição da imagem aqui

Website reference (all copyright to the website msdn.microsoft.com).


Or

Rewrite this method

protected override void OnOrientationChanged(OrientationChangedEventArgs e)
{
            if (e.Orientation == PageOrientation.Landscape)
            {

            }
            else if (e.Orientation == PageOrientation.Portrait)
            {

            }
            base.OnOrientationChanged(e);
}

Or the method itself

private void PhoneApplicationPage_OrientationChanged(object sender, OrientationChangedEventArgs e)
{
            if (e.Orientation == PageOrientation.Landscape)
            {

            }
            else if (e.Orientation == PageOrientation.Portrait)
            {

            }
 }

In that link has the detailed explanation.

Example

This example worked the Portrait and Landscape how do you expect.

<phone:PhoneApplicationPage
    x:Class="PhoneApp1.Page3"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="PortraitOrLandscape" Orientation="Landscape"
    mc:Ignorable="d"
    shell:SystemTray.IsVisible="True">

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <ScrollViewer x:Name="ContentGrid" Grid.Row="1" VerticalScrollBarVisibility="Auto">
                <!--You must apply a background to the StackPanel control or you
    will be unable to pan the contents.-->
                <StackPanel Background="Transparent" >
                    <!--Adding various controls and UI elements.-->
                    <Button Content="This is a Button" />
                    <Rectangle Width="100" Height="100" Margin="12,0"
            HorizontalAlignment="Left" Fill="{StaticResource PhoneAccentBrush}"/>
                    <Rectangle Width="100" Height="100" HorizontalAlignment="Center"
            Fill="{StaticResource PhoneAccentBrush}"/>
                    <Rectangle Width="100" Height="100" Margin="12,0"
            HorizontalAlignment="Right" Fill="{StaticResource PhoneAccentBrush}"/>
                    <TextBlock Text="This is a line of text that will wrap in portrait
            orientation but not landscape orientation." TextWrapping="Wrap" />
                    <CheckBox Content="A CheckBox"/>
                    <RadioButton Content="A RadioButton" />
                </StackPanel>
            </ScrollViewer>
        </Grid>
    </Grid>

</phone:PhoneApplicationPage>

For your solution, example:

<phone:PhoneApplicationPage
    x:Class="PhoneApp1.Page4"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="PortraitOrLandscape" Orientation="Portrait"
    mc:Ignorable="d"
    shell:SystemTray.IsVisible="True" Loaded="PhoneApplicationPage_Loaded" OrientationChanged="PhoneApplicationPage_OrientationChanged">  
    <!--Solução-->   
    <Grid x:Name="LayoutRoot" Background="Transparent">        
        <Grid.RowDefinitions>            
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <StackPanel Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="15,0,0,0" VerticalAlignment="Top" HorizontalAlignment="Stretch">
            <ScrollViewer x:Name="ContentGrid" Grid.Row="1" VerticalScrollBarVisibility="Auto" Margin="2,2,10,0">
                <phone:LongListSelector Name="lstConsPais"  HorizontalAlignment="Stretch" VerticalAlignment="Stretch" LayoutMode="List" IsGroupingEnabled="False" SelectionChanged="lstConsPais_SelectionChanged">
                    <phone:LongListSelector.ItemTemplate>
                        <DataTemplate>
                            <Border BorderBrush="#111" Margin="0, 10, 0, 0" BorderThickness="0,0,0,2" Width="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                <StackPanel VerticalAlignment="Center" Orientation="Horizontal" Width="Auto">
                                    <Image Height="100" Width="100"  Source="{Binding NomeImgBandeira}" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5,0,0,0"/>
                                    <StackPanel Orientation="Vertical" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                        <TextBlock Text="{Binding NomePais}" Style="{StaticResource PhoneTextGroupHeaderStyle}" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="15,25,0,0" />
                                    </StackPanel>
                                </StackPanel>
                            </Border>
                        </DataTemplate>
                    </phone:LongListSelector.ItemTemplate>
                </phone:LongListSelector>
            </ScrollViewer>
        </Grid>
    </Grid>
<!--Solução-->
</phone:PhoneApplicationPage>

References:

  • Will I have to "tell" him to resize? There is no way to be type "automatic"? As in android.

  • There’s an example in the link I gave you that the first case fits your question.

  • You know why mine isn’t resizing?

  • @Exception I pasted a page I made here on my VS Phone and it worked... please look at the reply

  • really with your example worked. But for what reason mine doesn’t work? Why doesn’t it resize to complete the whole screen?

  • @Exception made the change in the reply again and note the item "For your solution, example:".

  • When I take the Width the list no longer appears. I updated the question!

  • Exception without the width it has no size so it’s like 0. Did you look at the example I gave you, it’s right as you wanted it ? take a look!

  • Yes, I looked, I copied and pasted in mine xaml, and the list does not appear because of width. If I put one tamanho, I have to think of a "dynamic" for it to work in landscape and in the portrait.

  • @Exception is hard to talk about your model there, I’m not seeing the whole shaman you sent a part and I sent you a whole have differences you saw ... look at your not even this <Scrollviewer x:Name="Contentgrid" Grid.Row="1" Verticalscrollbarvisibility="Auto">

Show 5 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.