Scrollviewer doesn't scroll with touch - xaml

So I have come to that point where I am saying to myself over and over again I am missing some basic stuff.
I have a ScrollViewer with a RichTextBlock that converts HTML to the content.
Everything shows up as expected but I can't scroll! I had the VerticalScrollBarVisibility to Hidden but I have taken that out. After seeing this anwsear in StackOverflow I have stoped with the following code:
<ScrollViewer VerticalAlignment="Stretch"
HorizontalScrollMode="Disabled"
VerticalScrollBarVisibility="Visible"
VerticalScrollMode="Auto"
ZoomMode="Disabled"
Padding="52"
Background="#60000000" >
<RichTextBlock rtbx:Properties.Html="{Binding TextHTML}"
TextAlignment="Justify"
FontSize="20" />
</ScrollViewer>
It also seems that the PanningMode is not avaiable in Windows 8 but I belive that it is still the expected behaviour to scroll with the touch.
I have tried to put the ManipulationMode to All in the ScrollViewer and also tried to set to none in the RichTextBlock. However, I got no sucess with those approaches.

Removing the manipulation modes and isolating the problem and simplifing the "options" I was using led me to the conclusion that the ScrollViewer wasn't the issue.
The problem was: I had was a Control that was on top of the ScrollViewer that was hidden (opacity = 0). This Control swallowed all the events that I was needing in the ScrollViewer. Basic mistake.
I had to put the Visibility equals to Collapsed.

Related

Win 10 UWP Mapcontrol PointerMoved event missing

Until some month ago this code was able to rise the PointerMoved event:
<maps:MapControl Name="myMap" Canvas.ZIndex="1"> </maps:MapControl>
<StackPanel x:Name="overlay" Grid.Column="1" Grid.ColumnSpan="3" Canvas.ZIndex="5" Background="Transparent" IsHitTestVisible="False" />
It seems that something changed since this post has been published.
Right now I can't get anymore the MyMap_PointerMoved or MyMap_PointerPressed with or without the empty stackpanel over the map.
Curiously MyMap_PointerMoved event fires only if I leave the zoom + and - signs visible.
Event fires only when mouse is over the those sings.
I've added a polygon mapelement on the map. Only the MyMap_MapElementPointerEnter/Exited events fires.
Any idea how to solve this issues and make the maps work again?
Tnx. Stefano
Found the problem. For some reason I can't evaluate the .png image I have used until now in causing the crash. Replaced with a new one solved the problem.

RichEditBox text wrapping UWP

I am trying to get a RichEditBox to take over the entire width of the app window and to be responsive to window resizing, so far the code I have is the following:
<RichEditBox HorizontalAlignment="Stretch"
TextWrapping="WrapWholeWords"
Height="250"
Name="Intro"/>
What I am getting from the code above is this:
Any ideas on how can I get this to work? Why is it that I tell the text to wrap and it doesn't follow?
UPDATE
I also tried this:
<RichEditBox HorizontalAlignment="Stretch"
Height="250"
Name="Intro"/>
But the result is:
The problem that I am having is that it seems that HorizontalAlignment="Stretch" does not really do anything. The only way I am able to set a decent width is by hard-coding it, for example: Width="600". But if I do this my UI will not respond correctly to resizing. I also tried HorizontalContentAlingment="Stretch" but the result is exactly the same.
How can I get my RichEditBox take up all the available Width and Wrap at the same time?
If you look at the documentation of RichEditBox.TextWrapping, you'll notice that WrapWholeWords is invalid. You have to use
<RichEditBox TextWrapping="Wrap"/>
-or-
<RichEditBox TextWrapping="NoWrap"/>
Since Wrap is the default value, you can drop the property.
<RichEditBox HorizontalAlignment="Stretch"
Height="250"
Name="Intro"/>
Edit: in reply to the updated question:
A control only takes the width of it's parent control. Some container controls (e.g. Grid) automatically take the full width available, while others (e.g. StackPanel) only take the required size of it's children. Using HorizontalAlignment="Stretch" in combination with a StackPanel as a parent control, will only use the MinWidth property instead of the full available width on your screen. Sometimes you can't directly see this issue, e.g. when your control is inside an itemtemplate of a ListView. Use the Live Visual Tree in Visual Studio to find the parent containers and locate the issue.
So in short: make sure your RichEditBox is inside a Grid (or similar control) instead of a StackPanel.

WinRT, Does the scrollviewer not work in the emulator?

I ran into a little bug while creating a scrollable stackpannel. I used the scrollviewer. I have placed the Stackpannel inside the Scrollviewer but I can't scroll using a emulator.. I don't have a windows phone so I cant check it out on an actual phone. Here is my code:
<ScrollViewer Height="979" Margin="0,100,0,-439" VerticalAlignment="Stretch">
<StackPanel Height="979" VerticalAlignment="Stretch" Width="268">
// things inside the stackpannel
</StackPanel>
</ScrollViewer>
Am I doing something wrong or does the scrollviewer not work in an emulator?
The height of the ScrollViewer is the same as the height of the StackPanel so there is nothing to scroll (it just falls off the end of the screen). Try using VerticalAlignment="Stretch" instead of setting Height on the ScrollViewer which should help (if not, you have some other problem in your layout ;-) but using a fixed, smaller Height for the ScrollViewer will solve this immediate problem).

The scrollviewer "locks" when scrolling vertically or horizontally

If I start the scrolling vertically or horizontically the scroller "locks", such that you can only scroll horizontically or vertically, untill you let go. If I however start of by scrolling diagonally, there is no problem, in thhese cases I can manouvre the scrollviewer how i want. How do I make sure that the scrollViewer doesn't "lock" if I start of scrolling vertically or horizontically. Here is my scrollViewer:
<StackPanel>
<TextBlock x:Name="MainPageTitle" Text="{Binding title}" Height="89"/>
<ScrollViewer Width="768" Height="380" HorizontalScrollBarVisibility="Hidden">
<Map/>
</ScrollViewer>
<TextBlock x:Name="LEgE" Text="HEJHEJEHEJEHJEHJ"/>
</StackPanel>
So just to clarify, how do I make sure that no matter how I start of the scroll, I'm always capable of scrolling in any direction. With in the grid of course. Any help would be appreciated.
This is a known Issue that the scrollviewer runs on "rails".
Which is also stated in the artikel in msdn forums http://social.msdn.microsoft.com/Forums/wpapps/en-US/8fdbe189-c037-4f55-89c5-6d6814dc58f2/scrollviewer-locks-when-you-only-scroll-horizontally-or-vertically?forum=wpdevelop
But one could look at how to handle manipulation events for windows phone
http://msdn.microsoft.com/en-us/library/windowsphone/develop/ff426933(v=vs.105).aspx
For this you need to set ScrollViewer.ManipulationMode to Control and manage it yourself.
But as stated in the first link, to acheive smoothness is very hard.

Windows8 Scrolling like in weather app

I have layout as described below:
<ScrollViewer>
<StackPanel Orientation="Horizontal">
<!-- ... -->
<ScrollViewer>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel ScrollViewer.VerticalScrollBarVisibility="Visible" Orientation="Vertical" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ScrollViewer>
<!-- ... -->
</StackPanel>
</ScrollViewer>
And I would like to achieve that effect that is present in weather app.
In my application, when you're scrolling horizontaly using mouse wheel, when pointer gets over ItemsControl it immediately starts scrolling verticaly wheras in weather application there's fluent horizontal scrolling effect and scrolling verticaly begins when there's some time hover that vertical collection.
Is that behaviour somewhere implemented by default?.
Szymon
Generally, the guideline is that introducing vertical scrolling in a horizontally scrolling repeater is a bad idea. I think you should NOT consider Weather (or any standard Windows 8 app) as a model to emulate. Most of them violate the guidelines in some of the worst ways.
The Weather app accomplishes what you are asking based on the current mouse placement, the motion of the grid, and control with focus. That's a complex way of saying, some developer dreamed up a solution to help make their UI as confusing to the user as possible.
Please, don't.
What I think they do in order to achieve that effect is this:
If the mouse is over the vertical list for a while, they deactivate the horizontal scroll and activate the vertical one. Once the mouse moved outside the list, they switch back (deactivate the vertical scroll and activate the horizontal scroll).
I have not tested this to see if this works, but I think it should.