We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Sample for custom view with activity indicator

Hello,

One of the the features listed for Sfbutton is the custom view for button that shows processing indicator within button. Is there a sample on how that can be implemented?

Thanks

Apurva

5 Replies

BK Bharathiraja K Syncfusion Team April 1, 2019 12:12 PM UTC

Hi Apurva, 
 
Greetings from Syncfusion. We can add any kind of view as custom view inside the SfButton by below  
 
Code Snippet [XAML] 
<buttons:SfButton HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" HeightRequest="60" CornerRadius="20"> 
            <buttons:SfButton.ControlTemplate> 
                <ControlTemplate> 
                    <StackLayout Orientation="Horizontal" VerticalOptions="Start" HorizontalOptions="FillAndExpand" > 
                    <busyindicator:SfBusyIndicator HorizontalOptions="Start" x:Name="busyindicator" AnimationType="Ball" IsBusy="True" ViewBoxWidth = "50" ViewBoxHeight="50" TextColor="Maroon" /> 
                        <Label HorizontalOptions="FillAndExpand" VerticalTextAlignment="Center" VerticalOptions="Center" Text="Processing" FontSize="20" /> 
                    </StackLayout> 
                </ControlTemplate> 
            </buttons:SfButton.ControlTemplate> 
        </buttons:SfButton> 
 
We have prepared the sample based on your requirement, that can be downloaded from below location. 
 
 
Output:  
 
 
Regards, 
Bharathi. 



ED Eugen Dolgi April 5, 2019 06:11 AM UTC

Button with ControlTemplate does not work under UWP! Button is not displayed completely. Not in your sample either. I tested versions 17.1.0.38 and 16.4.0.54.


HM Hemalatha Marikumar Syncfusion Team April 8, 2019 12:38 PM UTC

Hi Apurva,

Sorry for the inconvenience caused.

Your requirement has been achieve by using suggested "Content" property in SfButton. We have prepared the sample based on the Content property which has been download from below link

Sample Link: http://www.syncfusion.com/downloads/support/forum/143644/ze/SimpleSampleExample-888740433

Code Example:

  
<buttons:SfButton HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" HeightRequest="60" CornerRadius="20">
         <buttons:SfButton.Content>
                      <StackLayout Orientation="Horizontal" BackgroundColor="LightBlue" VerticalOptions="Start" HorizontalOptions="FillAndExpand" >
                                <busyindicator:SfBusyIndicator HorizontalOptions="Start" x:Name="busyindicator" AnimationType="SlicedCircle" IsBusy="True" ViewBoxWidth = "30" ViewBoxHeight="30" TextColor="Maroon" />
                              <Label HorizontalOptions="FillAndExpand" VerticalTextAlignment="Center" VerticalOptions="Center" Text="Processing..." FontSize="20" />
                    </StackLayout>
        </buttons:SfButton.Content>
</buttons:SfButton>

Please let us know if you have any concern.

Regards,
Hemalatha M.
 



UN Unknown April 18, 2019 07:55 PM UTC

Thank you so much for the help! These code samples helped me make it work!!


BK Bharathiraja K Syncfusion Team April 19, 2019 05:44 AM UTC

Hi Apurva, 
 
We are glad that the reported problem resolved at your end. 
 
Regards, 
Bharathi. 


Loader.
Live Chat Icon For mobile
Up arrow icon