How to create progress bar with rounded corners / Edge in Xamarin forms

Question

I need the expert help. I am struggling to create the ProgressBar with rounded corner in Xamarin Form. I have searched on google and found the couple of post by using the layer property ex. "Layer.CornerRadius = 5" but my code does not support it.

How to make a progress bar with rounded corners in Xamarin forms.

(The above example not supported)

How can I create the rounded Edge of the progress bar?

Sample Code (TestControls.xaml usnig XamarinForm):-

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:Test.Mobile"
            xmlns:ffimageloadingsvg="clr-namespace:FFImageLoading.Svg.Forms;assembly=FFImageLoading.Svg.Forms"
             x:Class="Test.Mobile.UI.TestControls">
    <ContentPage.Content>

            <Grid Grid.Column="1"  Margin="0" Padding="0"  BackgroundColor= "LightYellow"  >
                <ProgressBar x:Name="pb_ProgressBar" Margin="70,0,30,0"   Progress="0.0" WidthRequest="300" HeightRequest="20" ProgressColor="DarkSlateBlue" VerticalOptions="Center"  BackgroundColor="AntiqueWhite"></ProgressBar>
            </Grid> 

    </ContentPage.Content>
</ContentPage>

and Code behind file as

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading;
using System.Threading.Tasks;

using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace Test.Mobile.UI
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class TestControls : ContentPage
    {
        public TestControls ()
        {
            InitializeComponent ();

            Device.BeginInvokeOnMainThread(async () =>
            {
                await pb_ProgressBar.ProgressTo(1.0, 10000, Easing.Linear);
            });
        }         

    }
}

Please help me how to make a progress bar with rounded corners in Xamarin forms?

Possible duplicate of [How to make a progress bar with rounded corners in Xamarin forms](https://stackoverflow.com/questions/46420739/how-to-make-a-progress-bar-with-rounded-corners-in-xamarin-forms) — Andrew, Sep 10 '18 at 13:36
The example you linked should work fine. Did you create a custom renderer in both the iOS and Android projects? The customer iOS renderer is where the `Layer.CornerRadius=5` is being set, not in the code behind of the view. — Andrew, Sep 10 '18 at 13:39
I am using for Android initially. For that Layer.CornerRadius property is not supported. INfect Layer is not supported. How can I solve this issue? — skt, Sep 10 '18 at 13:42
Check out the first (and only) answer in the question you linked to: https://stackoverflow.com/a/46450550/8395242 — Andrew, Sep 10 '18 at 13:43
I can not use the code at stackoverflow.com/a/46450550/8395242 in my code because of the library. — skt, Sep 10 '18 at 14:07
What library? I don't see a library in the linked answer, and the only library you have posted in your code is FFImageLoading, which isn't even used in your example. — Andrew, Sep 10 '18 at 14:27
I can not use xmlns:android="http://schemas.android.com/apk/res/android". The device android tablet will be use offline and no internet access. Its communicating with some other hardware device by Bluetooth. — skt, Sep 10 '18 at 14:41

score 0 · Answer 1 · edited Jun 20 '20 at 09:12

I can not use xmlns:android="schemas.android.com/apk/res/android";. The device android tablet will be use offline and no internet access.

This is not library, you could refer to the question:

Why this line xmlns:android=“http://schemas.android.com/apk/res/android” must be the first in the layout xml file?

As NitroG42 said, in XML, xmlns declares a Namespace. In fact, when you do:

<LinearLayout android:id>
</LinearLayout>

Instead of calling android:id, the xml will use http://schemas.android.com/apk/res/android:id to be unique. Generally this page doesn't exist (it's a URI, not a URL), but sometimes it is a URL that explains the used namespace.

The namespace has pretty much the same uses as the package name in a Java application.

You could refer to the documentation:

Uniform Resource Identifier (URI)

A Uniform Resource Identifier (URI) is a string of characters which identifies an Internet Resource.

The most common URI is the Uniform Resource Locator (URL) which identifies an Internet domain address. Another, not so common type of URI is the Universal Resource Name (URN).

How to create progress bar with rounded corners / Edge in Xamarin forms

1 Answers1