Xamarin Animated Circle Loading View

C# Port of the Android Java library AnimatedCircleLoadingView by jlmd

A determinate/indeterminate loading view animation. Based on android-watch-loading-animation by Nils Banner

Namespace: Xama.JTPorts.AnimatedCircleLoadingView

Outstanding Tasks:

• Ensure Interfaces are implemented as per OOP standards.

• Apply standard capitalizations across the library as per .Net guidelines.

• Fix xml attributes

• Replace android 'listeners' with events.

• Replace colour implementations to match Xamarin.Android property requirements.

• Ensure that non-optional parameters are all auto-populated if not supplied for the OO implementation.

• Check for missing functionality in ported library and task out implementation.

• Create NuGet package.

• Fill basic usage information.

How to Install

Simply add the NuGet package directly to your Xamarin.Android solution, or use one of the following:

Package Manager:

Install-Package Xama.JTPorts.AnimatedCircleLoadingView -Version 1.0.1

.NET CLI:

dotnet add package Xama.JTPorts.AnimatedCircleLoadingView --version 1.0.1

Basic Usage:

Create control in your xml layout:

<Xama.JTPorts.AnimatedCircleLoadingView.AnimatedCircleLoadingView
  android:id="@+id/circle_loading_view_indeterminate"
  android:layout_width="250dp"
  android:layout_height="250dp"
  android:background="@color/white" />

Indeterminate Progress

Get control and assign the colors, this is important as currently the control can't infer these if not provided

AnimatedCircleLoadingView animatedCircleLoadingView = FindViewById<AnimatedCircleLoadingView>(Resource.Id.circle_loading_view_indeterminate);

animatedCircleLoadingView.MainColor = Resource.Color.colorPrimaryDark;
animatedCircleLoadingView.SecondaryColor = Resource.Color.risualOrange;
animatedCircleLoadingView.TextColor = Resource.Color.colorAccent;
animatedCircleLoadingView.CheckMarkTintColor = Color.White;

You can define a center body of text to sit inside of the loading view if needed

animatedCircleLoadingView.TitleText = "Loading";

Then simply start the animation

animatedCircleLoadingView.StartIndeterminate();

Determinate Progress

Get control and assign the colors, this is important as currently the control can't infer these if not provided

AnimatedCircleLoadingView animatedCircleLoadingView = FindViewById<AnimatedCircleLoadingView>(Resource.Id.circle_loading_view_indeterminate);

animatedCircleLoadingView.MainColor = Resource.Color.colorPrimaryDark;
animatedCircleLoadingView.SecondaryColor = Resource.Color.risualOrange;
animatedCircleLoadingView.TextColor = Resource.Color.colorAccent;
animatedCircleLoadingView.CheckMarkTintColor = Color.White;

Start the animation

animatedCircleLoadingView.StartDeterminate();

Then simply set the percentage using this method (takes an integer value)

animatedCircleLoadingView.SetPercentage(50);

Currently when the control hits 100 percent it automatically adds the FinishedOK view, but you can also fire this manually.

animatedCircleLoadingView.StopOk();

or the failed view

animatedCircleLoadingView.StopFailure();

Support 💎

If you want to support the work that I do and you find any of these libraries useful? Consider supporting it by joining stargazers for this repository. 🔭 🌠

or alternatively if you want to you can also buy me a coffee.

You know, only if you want to.