I have the following XAML :
<ScrollViewer HorizontalAlignment="Left" Margin="3,226,0,0" Name="Scv" VerticalAlignment="Top" ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollBarVisibility="Auto" >
<Canvas Height="100" Name="canvas1" Width="292" >
Image Canvas.Left="0" Canvas.Top="0" Height="440" Name="image1" Stretch="Fill" Width="730" / >
<InkPresenter Name="inkPresenter1"></InkPresenter>
</Canvas>
</ScrollViewer>
The problem : How do I stop the ScrollViewer from scrolling AFTER i have scrolled the image to the point I wanted.
In the Above example, I use scrollViewer to scroll the image to a section where I want to stop so that I can use InkPresenter to draw. But Whenever I draw Up or down, the scrollviewer follows the action of InkPresenter Up and down movement.
Thanks
Check this discussion:
How to block scrolling in ScrollViewer
Another option could be to dynamically set the SetVerticalScrollBarVisibility do Disabled:
ScrollViewer.SetVerticalScrollBarVisibility(scrollViewer, ScrollBarVisibility.Disabled);
Related
I am using pivot control to display full sizes multiple image on the screen as a flip view. But the problem with pivot is that it is taking empty space between two pivot items. How to eliminate this space?
If any other solution is available to display images as Flip view,please share.
I used FlipView control by Kinnara fork's as a datatemplate of ListBox:
<ListBox Background="AntiqueWhite" x:Name="FlipViewList" ScrollViewer.VerticalScrollBarVisibility="Visible" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ItemTemplate="{StaticResource DataTemplate2}"/>
<DataTemplate x:Key="DataTemplate2">
<Grid Height="200">
<toolkit:FlipView x:Name="ImagePivot" Height="200" ItemsSource="{Binding imageCollection}" Tag="{Binding}" IsLocked="False" Grid.ColumnSpan="1" Grid.RowSpan="1">
<toolkit:FlipView.ItemTemplate>
<DataTemplate>
<Grid HorizontalAlignment="Left" Height="200" Width="480">
<Image Stretch="Fill" Source="{Binding images}" Height="200" Width="480"/>
</Grid>
</DataTemplate>
</toolkit:FlipView.ItemTemplate>
</toolkit:FlipView>
</Grid>
</DataTemplate>
Everything works fine but the vertical scrool is not working for listbox. How to resolve this scrool issue?
The problem here is there's no FlipView provided by msdn for the WP8 platform where as it's been added to the 8.1 version:
How to add a flip view
There are two options or even could be more, but i'm mentioning here two of them:
1) You could try out the Telerik SlideView control:
WinRT FlipView like control in WP8
Sample has been given here.
2) Or else you could go for the FlipView provided by Kinnara's fork.
I had a similar problem, so I decided to use my own custom XAML control. Basically, you can have a StackPanel that holds the images, and house that StackPanel within a Horizontally Scrolling ScrollViewer, and can modify the scrolling so that it scrolls 1 item at a time. the Images can be given a margin before adding them to the StackPanel, and that's how you can achieve the spacing between them. Check this out for instructions and a sample - https://quirkd.wordpress.com/2015/01/18/make-your-own-swipe-carousel-control/
I am using a Grid view and have defined two elements, WebBrowser and an Image, to be contained inside that Grid.
<Grid x:Name="ContentPanel" Background="Black">
<phone:WebBrowser Name="WebView"
IsScriptEnabled="True"
Grid.Row="0"
IsGeolocationEnabled="True"
ScriptNotify="webView_ScriptNotify"
NavigationFailed="webView_NavigationFailed"
Navigated="webView_Navigated"
Navigating="webView_Navigating"
VerticalAlignment="Top"
LoadCompleted="WebView_LoadCompleted"
Canvas.Top="0"
Canvas.Left="0"
Height="{Binding ActualHeight, ElementName=LayoutRoot}"
Width="{Binding ActualWidth, ElementName=LayoutRoot}">
</phone:WebBrowser>
<Image Name="StartLogo" Source="/Assets/StartScreen3.png" Stretch="None" VerticalAlignment="Bottom" HorizontalAlignment="Center"></Image>
</Grid>
I want the image to come over WebBrowser view at bottom. But with WebBrowser visible Image is not showing up. Can someone help me to fix it. I don't want to resize the WebBrowser to some smaller height.
And also how does order of defining elements inside a Grid affects the view?
EDIT:
I used Canvas to contain both of these. Works fine now.
the image should be show as apparently nothing is wrong with your code. It might be that image color and opened web page color is same that is why image might not be visible. or some issue with image path or build action of the image.
the last UI element will be on top all other UI elements in the gird. as per your xaml image control will be top of the webbrowser control but at the bottom of the grid.
There is no mistake in your code but still if you are facing this Problem
Try this:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<phone:WebBrowser Name="WebView"
IsScriptEnabled="True"
Grid.Row="0"
Grid.RowSpan="2"
IsGeolocationEnabled="True"
ScriptNotify="webView_ScriptNotify"
NavigationFailed="webView_NavigationFailed"
Navigated="webView_Navigated"
Navigating="webView_Navigating"
VerticalAlignment="Top"
LoadCompleted="WebView_LoadCompleted"
Canvas.Top="0"
Canvas.Left="0"
Height="{Binding ActualHeight, ElementName=LayoutRoot}"
Width="{Binding ActualWidth, ElementName=LayoutRoot}">
</phone:WebBrowser>
<Image Name="StartLogo" Source="/Assets/ApplicationIcon.png" Stretch="None" VerticalAlignment="Bottom" HorizontalAlignment="Center" Grid.Row="1"></Image>
</Grid>
The Order of Defining UI Elements Overlaps the Previos Defined Control
If you right click the object in design mode you should be able to order the objects on the application page?
I have a horizontal ScrollView implemented and working. however, when I Scrol horizontally he walks, but when he returns to deslargo initial position no reason for it.
Anyone know a solution?
Thanks
<ScrollViewer ScrollViewer.HorizontalScrollBarVisibility="Visible" ScrollViewer.VerticalScrollBarVisibility="Disabled" Height="50" Width="Auto">
<StackPanel Name="sp_urlsHome" Orientation="Horizontal" Height="50" Width="Auto">
<TextBlock Text="adasdasdsasdfffffffffffffffffffffffffsdfsdfsdfsdfsfsdfdas"/>
</StackPanel>
</ScrollViewer>
You must set right ScrollViewer Width. Inner control will scroll only if it Width is greater that ScrollViewer Width. Check that moment, please (ScrollViewer should not resize while increasing content size)
Just posted your code into blank page and it works fine
I'm trying to implement zoom in/out functionality in a ScrollViewer in WP7. Inside my scrollviewer is a usercontrol, which consists of a grid and some ellipsis in variaous cells.
Implementing no zoom, I am able to run the app in the emulator and scroll the scrollviewer up/down, left/right.
My initial thought was to use a scale transform on the scrollviewer:
<ScrollViewer x:Name="svScale"
Margin="0"
Grid.Row="1"
HorizontalScrollBarVisibility="Visible">
<ScrollViewer.RenderTransform>
<ScaleTransform ScaleX="2" ScaleY="2"/>
</ScrollViewer.RenderTransform>
<ScrollViewer.RenderTransformOrigin>
<Point X=".5" Y=".5"/>
</ScrollViewer.RenderTransformOrigin>
<local:MyControl x:Name="test"
Width="486"
Height="56">
</local:MyControl>
</ScrollViewer>
The problem is that when I scroll around, the scrollviewer always scrolls the contents back to the vertical and horizontal center.
So I tried applying the scale transform to the user control:
<ScrollViewer x:Name="svScale"
Margin="0"
Grid.Row="1"
HorizontalScrollBarVisibility="Visible">
<local:MyControl x:Name="test"
Width="486"
Height="56"
SelectedKey="{Binding SelectedKey}"
SelectedScale="{Binding SelectedScale}">
<local:MyControl.RenderTransform>
<ScaleTransform ScaleX="2" ScaleY="2"/>
</local:MyControl.RenderTransform>
<local:MyControl.RenderTransformOrigin>
<Point X=".5" Y=".5"/>
</local:MyControl.RenderTransformOrigin>
</local:MyControl>
</ScrollViewer>
But when I apply the scale transform to the user control, it doesn't appear any larger than it normally does, regardless of what the ScaleX and ScaleY values are. What is going on here?
Here is a simple XAML snippet:
<Grid x:Name="ContentGrid">
<ContentControl Background="Yellow" VerticalAlignment="Stretch"></ContentControl>
</Grid>
In WPF, the content control stretches the entire height of the grid.
In WP7 however, the content control does not stretch.
Why?
Avoid using ContentControl directly.
If you use something which inherits from it, such as a button, then, in a grid, as per your example, you'll automatically get horizontal and vertical stretching.
This will creat a button with a yellow background which fills the screen:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Button Background="Yellow" />
</Grid>
However, if you just wanted a yellow background to your grid - which is all your sample would do - you could just set the background property on the grid itself.
I fixed this by defining my own template:
<ContentControl><ContentControl.Template><ControlTemplate><ContentPresenter/> ...
Not sure why it fixes it but it works....