Xamarin Forms: scroll position in scrollview - xamarin

Is there no possibility to read and set the position of the scrollview? For example, I would like to start the app with the scroll position at the bottom, not at the top.

You can get the X and Y position of a ScrollView from the ScrollX and ScrollY properties of the ScrollView object. Then you can set the position with the ScrollView method ScrollToAsync.
var x = scrollView.ScrollX;
var y = scrollView.ScrollY;
...
bool animate = false;
scrollView.ScrollToAsync(x, y, animate);

I've a better approach to this!
You can add this to your onAppearing() method:
protected override void OnAppearing()
{
base.OnAppearing();
/*Other stuff*/
viewModel.Messages.CollectionChanged += (sender, e) =>
{
var target = viewModel.Messages[viewModel.Messages.Count - 1];
ItemsListView.ScrollTo(target, ScrollToPosition.End, false);
};
}
This means that if your collection change, you get the target which is the last item (the one in the bottom) the you use scrollTo target, position end, with animation false.
when you get to the page it will open in the bottom, you don't see the scrolling because animation is false!

For Android, I have found a solution:
I write a custom renderer and in the OnDraw override Method, I call FullScroll(FocusSearchDirection.Down) the first time when the method is called.
What it makes easy, the Android ScrollViewRenderer is subtype of Android.Widget.ScrollView.
At the moment, I don't need an implementation for iOS, so I have no solution for iOS.

Related

Scrolling not smooth with ScrollView control in IOS devices

I have been using SkiaSharp for a few month now and having great success on showing my drawing instructions on Android & IOS device. I am using SKCanvasView control which I am placing it inside ScrollView control. On scroll of ScrollView translating SKCanvasView to ScrollTop and ScrollLeft position so that SKCanvasView should intact with Visible region of ScrollView Control.
This is all working smoothly in Android. But in IOS device, scrolling is not smooth. Scrolling is holding by UI thread and it si not smooth. PLease have a look at the code and please suggest if you have any suggestions.
private void View_PaintSurface(object sender, SKPaintSurfaceEventArgs e)
{
SKRect rect = paginatedViewProvider.GetViewPortRect();
// I have lots of image tiles which I am drawing on skbitmap and returning it. This is taking around 10ms
SKBitmap pageBitmap = GenerateSKBitmapFromIntenseCalculation();
float Top = (float)(rect.Top - scrollTop);
float Left = (float)(rect.Left - scrollLeft);
e.Surface.Canvas.DrawBitmap(pageBitmap, SKRect.Create(Left, Top, rect.Width, rect.Height));
}
private bool OnTimerTick()
{
viewPanel.InvalidateSurface();
return true;
}

Xamarin.Forms Scrolling Grid With Relative Sizes

I have managed to create a GridView inside a ScrollView that uses 8 rows of row height 250 (Absolute). This was fine until I realised it would not work on screens with different resolutions. How can I create a grid view where there are 8 rows, but each row takes up half the screen so you have to scroll down to see the rest? Using 8 rows of height "*" just puts 8 rows onto the view with no scrolling. I am using xaml but can use c# if necessary.
You can access the device's screen height, so calculate 0.5 * height and set this as row height:
Create a static variable in app.xaml.cs
static public int ScreenHeight;
Then you need to set the value of your variable for iOS and Android.
Android: MainActivity.cs
protected override void OnCreate(Bundle bundle)
{
base.OnCreate (bundle);
global::Xamarin.Forms.Forms.Init(this, bundle);
App MyApp = new App();
App.ScreenHeight = (int)(Resources.DisplayMetrics.HeightPixels / Resources.DisplayMetrics.Density);
}
iOS: AppDelegate.cs
public override bool FinishedLaunching(UIApplication app, NSDictionary options)
{
App.ScreenHeight = (int)UIScreen.MainScreen.Bounds.Height;
global::Xamarin.Forms.Forms.Init();
LoadApplication(new App());
return base.FinishedLaunching(app, options);
}
Now, have a property in the view's ViewModel which accesses ScreenHeight and calculate it to your needs
public int HalfScreenHeight
{
get { return App.ScreenHeight / 2; }
}
Finally, you can your row's height to HalfScreenHeight.
Important: If you allow device rotation for Portrait and LandScape mode on your page, you might need to update the binding according to your needs. You can access the screen's width in the same way.

UIScrollView's does not scroll AFTER rendering WKWebView content

Thank you for looking at my question. Currently, I have several input fields and a WKWebView embedded in a UIScrollView. Before any events fire, all the subviews fit inside the scroll view with no issue. I'm dynamically setting the WK's height based on document.body.scrollHeight which is captured in the DidFinishNavigation delegate located in WKNavigationDelegate. After the WK's height is set, the WK extends past the view-able content. Here's the code which I'm trying to force the scrollview to resize itself.
[Export("webView:didFinishNavigation:")] public async void DidFinishNavigation(WKWebView webView, WKNavigation navigation)
{
//get the webView's initial height
var initialHeight = webView.Frame.Height;
//get height of HTML's document.body.scrollHeight
var contentHeight = await GetContentHeight();
//create new frame for webview
CGRect newWebViewFrame = new CGRect(webView.Frame.X, webView.Frame.Y, webView.Frame.Width, contentHeight);
//set webview's frame
webView.Frame = newWebViewFrame;
//get the difference of webView's initial height and webView's current height
var differenceInHeight = contentHeight - initialHeight;
//create new cgrect and set the height to svMain's height + the difference in height of the HTML document
CGRect newScrollViewFrame = new CGRect(0, 0, svMainScroller.Frame.Width, svMainScroller.Frame.Height + differenceInHeight);
//set MainScroller's frame
svMainScroller.Frame = newScrollViewFrame;
//force scrolling
svMainScroller.ScrollEnabled = true;
//scrolling should be handled in the main scroller
webView.ScrollView.ScrollEnabled = false;
svMainScroller.SizeToFit();
}
The desired effect is to have the scroll view be able to scroll to the end of the newly defined height. Any tips on how would I go about doing that would be greatly appreciated.
Updating the frame of the scroll view was the problem. My guess is that if the frame is big enough to contain all of the contents, then there's no need to scroll. So, I updated the scroll view's ContentSize instead of updating its frame.
svMainScroller.ContentSize = new CGSize(View.Frame.Width, View.Frame.Height + differenceInHeight);
Also, as a side note, verify that wkwebview is added as a subview to the scroll view and not the main view.

Xamarin change height of progress bar

I am trying to change the height of a progress bar by using a custom renderer like here
The problem is, when the screen is rotated, the progress bar goes back to normal. Can someone help me?
I am using the same solution:
public override void LayoutSubviews()
{
base.LayoutSubviews();
var X = 1.0f;
var Y = 10.0f;
CGAffineTransform transform = CGAffineTransform.MakeScale(X, Y);
this.Control.Transform = transform;
}
I thnk you need to call the command SetNeedsLayout as discussed here . Of course you can also disable orientation change.
public override void OnConfigurationChanged (Android.Content.Res.Configuration newConfig)
{
base.OnConfigurationChanged (newConfig);
SetNeedsLayout ();
}

Xamarin Forms Animations on startup

Im trying to get an image to be animated the moment the page is loaded but my approach doesnt seem to work on startup. But i have tested it with a button and it plays the animation no bother.
This is my constructor for my MainPage
public MainPage()
{
InitializeComponent();
CreatePanel();
var storyboard = new Animation();
var enterTop = new Animation
(
callback: d => bannerIcon.TranslationY = d,
start: -100,
end: 0,
easing: Easing.BounceOut
);
storyboard.Add(0, 1, enterTop);
storyboard.Commit(bannerIcon, "Banner", length: 1000);
Content = layout;
}
Should I have this code in the OnAppearing method or am I just coming at this completely wrong?
SOLUTION
Just had to move the animation code into the OnAppearing() method.
protected override void OnAppearing()
{
base.OnAppearing();
banner.IsVisible = false;
// animations
menuAnimations.FlyIn(banner, 1000);
menuAnimations.Rotate(btnSocial, 360);
menuAnimations.Rotate(btnVideo, 360);
menuAnimations.Rotate(btnSchedule, 360);
menuAnimations.Rotate(btnLunchMenu, 360);
menuAnimations.Rotate(btnContact, 360);
menuAnimations.Rotate(btnDetails, 360);
}
Your running the animation before you Content is even set (Possible Animation is finished before you can even view it which help with argument of the animation working on button click I would also do as you suggested and move the animation.commit inside the OnAppearing method and set the animation to a longer length for testing purposes

Resources