Skip to content

Latest commit

 

History

History
141 lines (115 loc) · 5 KB

README.md

File metadata and controls

141 lines (115 loc) · 5 KB
Raw

How to customize size of close button in Xamarin.Forms chip group

The chip control supports to customize the background color, border color, close button color, and more. The chip control can be customized using the following properties:

ShowCloseButton

The ShowCloseButton property sets the visible state of close button in SfChip.

[XAML]

 <ContentPage.Content>
        <StackLayout Margin="8,8,8,8" >
           <buttons:SfChip  Text="James" 
                            WidthRequest="150"
                            HorizontalOptions="Center"
                            VerticalOptions="Center"
                            ShowCloseButton="true" >
           </buttons:SfChip>  
        </StackLayout>
    </ContentPage.Content>

[C#]

            SfChip chip = new SfChip();
            chip.Text = "James";
            chip.WidthRequest = 150;
            chip.HorizontalOptions = LayoutOptions.Center;
            chip.VerticalOptions = LayoutOptions.Center;
            chip.ShowCloseButton = true;

ShowSelectionIndicator

The ShowCloseButton property sets the visible state of close button in SfChip.

[XAML]


           <buttons:SfChip  Text="James" 
                            WidthRequest="150"
                            HorizontalOptions="Center"
                            VerticalOptions="Center"
                            ShowCloseButton="true"
                            ShowSelectionIndicator="true"
                            >
           </buttons:SfChip>

[C#]

            SfChip chip = new SfChip();
            chip.Text = "James";
            chip.WidthRequest = 150;
            chip.HorizontalOptions = LayoutOptions.Center;
            chip.VerticalOptions = LayoutOptions.Center;
            chip.ShowCloseButton = true;
            chip.ShowSelectionIndicator = true;

CloseButtonColor

The CloseButtonColor property customizes the color of the close button in SfChip.

[XAML]

 
           <buttons:SfChip  Text="James" 
                            WidthRequest="150"
                            HorizontalOptions="Center"
                            VerticalOptions="Center"
                            ShowCloseButton="true"
                            CloseButtonColor="White"
                            >
           </buttons:SfChip>

[C#]

            SfChip chip = new SfChip();
            chip.Text = "James";
            chip.ShowCloseButton = true;
            chip.CloseButtonColor = Color.White;

BorderColor

The BorderColor property customizes the color of border in SfChip.

[XAML]

           <buttons:SfChip  Text="James" 
                            WidthRequest="150"
                            HorizontalOptions="Center"
                            VerticalOptions="Center"
                            BorderWidth="4"
                            BorderColor="Black"
                            >
           </buttons:SfChip>

[C#]

            SfChip chip = new SfChip();
            chip.Text = "James";
            chip.WidthRequest = 150;
            chip.HorizontalOptions = LayoutOptions.Center;
            chip.VerticalOptions = LayoutOptions.Center;
            chip.BorderWidth = 4;
            chip.BorderColor = Color.Black;

BorderWidth

The BorderWidth property customizes the thickness of border in SfChip.

[XAML]

           <buttons:SfChip  Text="James" 
                            WidthRequest="150"
                            HorizontalOptions="Center"
                            VerticalOptions="Center"
                            BorderWidth="8"
                            BorderColor="Black"
                            >
           </buttons:SfChip>

[C#]

            SfChip chip = new SfChip();
            chip.Text = "James";
            chip.WidthRequest = 150;
            chip.HorizontalOptions = LayoutOptions.Center;
            chip.VerticalOptions = LayoutOptions.Center;
            chip.BorderWidth = 8;