how to set the scroll position on top of silverlight Page - silverlight-4.0

I am Using silverlight4 I have developed one page when I navigate to this page from Other Silverlight Page the Position is at the bottom of the page .I need to set the Focus on top of the silverlight Page.I am not using ScrollViewer on my Page.

Open MainPage.xaml file and replace the code with the following.
<UserControl xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk" x:Class="ScrollViewerControl.MainPage"
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"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<Grid x:Name="LayoutRoot" Background="White">
<ScrollViewer Height="300" Width="300" Name="scrollViewer1"
VerticalScrollBarVisibility="Auto"
HorizontalScrollBarVisibility="Auto">
<ScrollViewer.Content>
<StackPanel>
' Content Here
</StackPanel>
</ScrollViewer.Content>
</ScrollViewer>
</Grid>
</UserControl>
set the ScollViewer offset to zero like
scrollViewer1.ScrollToVerticalOffset(0);
then your vertical scroll will always be on Top.

Related

Unwanted margin in NavigationView.Content

I made a simple app that does nothing. It inly displays a NavigationView with two items and a TextBlock as its content. This is the code:
<Page
x:Class="test.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:test"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<NavigationView>
<NavigationView.MenuItems>
<NavigationViewItem Content="First Item" />
<NavigationViewItem Content="Second Item" />
</NavigationView.MenuItems>
<TextBlock Style="{StaticResource HeaderTextBlockStyle}" Text="Welcome to my Page"/>
</NavigationView>
</Grid>
</Page>
My app looks like this:
Why is there extra space at the top of the TextBlock? And how to remove that space? I know it is possible because the News app uses NavigationView and there is no vertical margin. Here is its screenshot:
You need to set the AlwaysShowHeader property to False:
<NavigationView AlwaysShowHeader="False">
This is called out in the docs here, though the new preview version seems to change this behavior currently and not show any header by default.

Making the image as a background (Send to back)

I would like to have an image in this grid that serves as a background. Any attempt till now at inserting an image control resulted in the image being on top of the buttons while I would like it to be on the back.
<Page
x:Class="ZimmerFrei_v0._1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ZimmerFrei_v0._1"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid >
<Button x:Name="btnNearMe"
Content="Near Me"
HorizontalAlignment="Left"
Margin="99,181,0,0" VerticalAlignment="Top"
Height="76"
Width="216"
Click="btnNearMe_Click"/>
<Button x:Name="btnBestOffers"
Content="Button"
HorizontalAlignment="Left"
Margin="99,312,0,0"
VerticalAlignment="Top"
Height="76" Width="216"
Click="Button_Click"/>
<Image />
</Grid>
The simplest thing that you can do here is to give your Grid an Image Brush. Simply head to the Brush section in your properties windows and select the Tile Brush there. To the ImageSource property specify the image you want.
You can also check out this link for more help.
Hope this solves your problem.

ContentDialog's buttons are not shown in a Windows Phone 8.1 app if the BottomAppBar is defined

I would like to show a ContentDialog on first launch of my app, to show the EULA to the end user.
It seems that if an AppBar is defined in the calling page the two buttons in the dialog are not visible, an empty area with the same size of the command bar area defined in the calling page, is shown instead.
This is the markup on the ContentDialog:
<ContentDialog
x:Class="MyApp.EulaPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:MyApp.Pages"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="TERMS OF USE"
PrimaryButtonText="i agree"
SecondaryButtonText="cancel"
PrimaryButtonClick="OnAgreeButtonClick"
SecondaryButtonClick="OnCancelButtonClick">
<Grid x:Name="ContentPanel" Margin="0,0,0,0" >
<Grid.RowDefinitions>
<RowDefinition Height="524" />
</Grid.RowDefinitions>
<ScrollViewer Grid.Row="0" Margin="0,0,0,2" >
<RichTextBlock IsTextSelectionEnabled="False" TextAlignment="Left" TextIndent="0" FontSize="14" FontFamily="Segoe WP" >
</RichTextBlock>
</ScrollViewer>
</Grid>
The GridRowDefinition has a fixed hight, because the text in the RichTextBlock needs to be scrolled.
I have prepared a sample project that can be found here. The zip file contains also a screenshot showing how I see the dialog.
I had the same problem and I have solved it by modifying/removing Height/Width and Margins of the Contentdialog

Binding height and width of border to half of its children at runtime in windows 8.1 app

I have a user control which have elements like this
<UserControl
x:Class="App2.MyImageControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App2"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="400">
<Grid x:Name="MyGrid" x:FieldModifier="public" ManipulationMode="None" Tapped="MyGrid_Tapped" HorizontalAlignment="Left" VerticalAlignment="Top" >
<Grid.RenderTransform>
<CompositeTransform></CompositeTransform>
</Grid.RenderTransform>
<Border x:Name="MyBorder" x:FieldModifier="public" BorderThickness="1" BorderBrush="Transparent" Width="auto" Height="auto">
<Grid>
<Image x:Name="MyImageO" x:FieldModifier="public" Source="" Width="auto" Height="auto" Stretch="Fill"></Image>
</Grid>
</Border>
</Grid>
I want to bind MyBorder width and height to half of MyImageO width and height at runtime.How do I achieve that .
You could try using the MultiplyConverter to convert a bound value to half of it, but ActualWidth and ActualHeight aren't bindable - they don't raise change notifications. Your best bet is to simply handle SizeChanged events and then set the dimensions of the border based on ActualWidth and ActualHeight of the image.

Undesired bottom margin in (standard) 1080p layout template for a Windows Phone 8.1 app

When I run my Windows Phone 8 app on the 8.1 1080 emulator, there's a black bottom margin on all its pages (interestingly, it actually doesn't appear when I'm viewing any of these pages in the Design view).
Initially, I thought it may be as a result of my custom laid-out PhoneApplicationPage. So, I decided to create a new PhoneApplicationPage and not make any changes i.e. Visual Studio's auto-generated Portrait PhoneApplicationPage. This is its xaml:
<phone:PhoneApplicationPage
x:Class="App.Views._1080p"
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="Portrait" Orientation="Portrait"
mc:Ignorable="d"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Red">
<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,0">
<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">
</Grid>
</Grid>
The only change I've made is add a red Background property for the Grid just to better highlight the problem.
I've not made any changes to the code-behind.
Unfortunately, the problem persisted:
If I add an App Bar to the xaml, the problem becomes exacerbated.
This is the App Bar's xaml:
<!-- APP BAR -->
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar
x:Name="appBar"
IsVisible="True"
IsMenuEnabled="True"
Mode="Default"
Opacity="1" >
<!-- APP BAR ICONS -->
<shell:ApplicationBarIconButton
IconUri="a"
Text="Search"/>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
And this is what it looks like:
Any idea what's going on? And what I need to change to fix this problem? Any guidance would be much appreciated. I should add the problem does happen when running the app on a 1080p device too (i.e. not only a problem on the emulator).
Here is the explanation: on Windows Phone 8.1, the ApplicationBar's height is not fixed anymore, it depends on the device screen size. In order to not break existing 8.0 apps layouts, they added that black bar.
The height of this black bar is 12px (height of the 8.0 AppBar - 8.1 AppBar).
To remove it, you'll have to migrate the app to Windows Phone 8.1.