When creating a long string of text using a TextView on iOS and exceeding the height of the TextView it will allow you to scroll.
After scrolling back up to the top of the textview and selecting a piece of text my caret position is not correctly set and my textview will not scroll to the "tapped" position. This is probably caused by the overlapping keyboard.
I set up an easy to test template which is:
<template>
<Page backgroundColor="#6B00D4" backgroundSpanUnderStatusBar="true" actionBarHidden="true" class="page">
<GridLayout rows="auto">
<TextView row="0" height="auto"/>
</GridLayout>
</Page>
</template>
How will I be able to get the correct position when tapping on a piece of text?
EDIT: Just found out it only seems to happen on iOS 14
EDIT 2: The scroll position isn't used when positioning the caret, that's why the caret position seems off from the user tap position
EDIT 3: Seems to be a native iOS 14 issue: https://developer.apple.com/forums/thread/662056
Related
I have a NativeScript application with the ActionBar like the following image.
How can I force the ActionItem (3 bars icon) to be on the right side instead of the left side?
The problem is that on Android 10 and above, when device language is Hebrew (RTL language) the ActionItem is on the left and I would like to keep it right.
To align items inside the actionbar to the right, use:
<ActionBar title="HBreader">
<ActionItem
ios.position="right"
android.position="actionBar"
(tap)="doThisAndThat()"
>
// your view element here (image/icon/label/etc...)
</ActionItem>
</ActionBar>
In my nativescript app I noticed that sometimes the tap does not trigger right a way. I have to tap several times to trigger the event. This happens on both, android and ios.
How can I increase the tap hot zone? What else could be causing this to happen?
Thank you.
P.S. I tried increasing the padding of the element whose tap event I am capturing, but that did not seem to help.
I often increase the height and width of the view that have the tap event. You can give it a try.
There are a few factors at play here.
First, when you intercept a page-level event in NativeScript it seems to stop events from other widgets from firing. For example, if you tap on a text field but have a page-level listener for tap events, the tap on the TextField will be intercepted by the page-level listener.
Second, Double-tapping seems to exploit a timing issue in events, allowing the tap event to bubble up to the next listening widget.
Finally, when you have padding on the element you're trying to tap, the tap does not register on the padded areas. It will appear that you can only tap in the middle of the widget (inside of the padded area). In my case, the TextField on which I had padding had to be tapped directly in the vertical center (and that was with a padding of 5px).
To test it, try removing the padding from the element and see if the tapping works normally again.
I was able to create a very smooth / natural experience with the software keyboard by doing the following:
Wrap the TextField in a StackLayout and putting padding on the StackLayout instead of the widget
Add the page-level listener that dismisses the software keyboard ONLY when the textfield is tapped, and remove it once that listener is fired.
ex: XML file
<StackLayout id="loginFieldWrapper" padding="5 5 5 5">
<TextView hint="Enter Login ID" id="loginField" keyboardType="number" returnKeyType="done" returnPress="{{hideKeyboard}}" />
</StackLayout>
Backing javascript file
loginField.on(gestures.GestureTypes.tap, function(args) {
page.on(gestures.GestureTypes.tap, function (args) {
loginField.dismissSoftInput();
page.off(gestures.GestureTypes.tap);
});
});
Wrap the item inside some layout to increase the clickable area
<StackLayout (tap)="select(param)">
<Label text="{{description}}" textWrap="true" marginTop="40px" marginBottom="40px">
</Label>
</StackLayout>
Is it possible in xamarin ScrollView to start no from standard top or left, but from bottom or right?
<ScrollView x:Name="scroll" Orientation="Horizontal">
</ScrollView>
I think that ScrollToAsync(double x, double y, bool animated) should do the trick for you. Whenever your view first appears, use that to set the scroll view to whatever position you want. Then the user will start scrolling from there.
I have a project where I have multiple scrollviews in one:
I can scroll up and down through a single item, and also through multiple items horizontally.
Normally, the webview is not hittestvisible.
Moving horizontally works fine, but when I scroll down, I give focus and hittestvisibility to the single item, but it won't scroll down. Only when I scroll down the second time, it will scroll, I think because when the ManipulationStartedevent was fired, it was caught by the scrollview, which had focus at the time, and only later the webview takes the focus, therefore, it has no started position. Is there a workaround for this problem?
<ScrollViewer x:Name="Scroller"
HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Disabled"
ManipulationMode="Control"
Grid.Row="1" Grid.RowSpan="2" >
<StackPanel Name="WebScrollView" Orientation="Horizontal" >
<UserControl Name="LeftContentControl" MinWidth="480" />
<UserControl Name="MiddleContentControl" MinWidth="480" />
<UserControl Name="RightContentControl" MinWidth="480" />
</StackPanel>
</ScrollViewer>
So, Left, Middle and Right are the three controls which will hold the webviews as their content. When scrolled to the left( for example ), the left content is placed over the middle content, and the middle content is set into view again, so it seems like an endless list of webviews, but really are three.
I use a mediator to achieve the animation of the webviews.
Thanks in advance.
GeekPeek
I have an inkpresenter inside a scrollviewer for a Windows Phone 7 application. Often when the user starts to draw, the scrollviewer takes over mid stroke, making it hard to actually draw stuff. I tried disabling the ScrollBarVisibility when the inkpresenter needs to be used, but then the scroll viewer automatically pans back up to the top. So how can I prevent the scrollviewer from scrolling when the inkpresenter is in use, while still maintaining the scroll position?
<ScrollViewer Name="ScrollBars" VerticalScrollBarVisibility="{Binding ScrollEnabled}" >
<Canvas Height="2000">
...
<InkPresenter Name="InkCanvas" Strokes="{Binding Strokes}" Canvas.Top="500" />
</ Canvas >
</ScrollViewer >
Edit:
So I tried using the scrolling function in the codebehind to update the vertical offset, where I have a button linked to the following code:
var offset = scrollViewer.VerticalOffset;
ScrollEnabled = ScrollBarVisibility.Disabled;
scrollViewer.ScrollToVerticalOffset(offset);
Again, it just goes back up to the top. Any idea whats wrong?
After disabling the VerticalScrollBarVisibility call Scrollviewer.ScrollToVerticalOffset to manually bring the InkPresenter into view.