SimpleButton

Button with built-in progress state. Customization can be carried out for normal, disabled and pressed state.

iOS	Android

Android implementation has ripple effect when you press the button.

Inherits from AppCompatButton/UIButton

Customization fields

Type	Field	Description	Default value
FontStyleItem	FontStyle	Responsible for font customization.
UIFont Typeface	Font Typeface	Responsible for buttons title font.	System Roboto medium
float	LetterSpacing	Responsible for buttons title letter spacing.	-0.0125f
float	TextSize	Responsible for buttons title text size.	16
UIColor Color	TextColor	Responsible for buttons title text color in normal state.	#FFFFFF
UIColor Color	DisabledTextColor	Responsible for buttons title text color in disabled state.	#C0BFC0
UIColor Color	BackgroundColor	Responsible for buttons background color in normal state.	#3C6DF0
UIColor Color	DisabledBackgroundColor	Responsible for buttons background color in disabled state.	#EAEAEA
UIColor Color	PressedBackgroundColor	Responsible for buttons background color in pressed state. Android will add 0.5 alpha to selected ripple color and blend it with button's background color.	#3151B7
Color	RippleColor	Responsible for button's ripple color. Android will add 0.5 alpha to selected ripple color and blend it with button's background color.	#3151B7
ShadowConfig	ShadowConfig	Responsible for button's shadow configuration. For android, it changes only elevation and translationz property. iOS change shadow layer.

Methods

void StartProgressAnimation() - starts preloader animation

void StopProgressAnimation() - stops preloader animation

Notes

• Progress animation implemented with Lottie framework. It's not customizable, there is no possibility to change animation color or animation itself.

• Ripple color works only on Android.

• Android shadow config change only elevation property of the button. There is no possibility to set shadow offset or color.

Usage

Android

For Android platform, there are two ways to add SimpleButton to the layout: to the axml markup file or to the code behind.

Sample for creating SimpleButton in code behind for Android:

var simpleButton = new SimpleButton(Context);
simpleButton.LayoutParameters = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WrapContent, ViewGroup.LayoutParams.WrapContent);
simpleButton.Typeface =  Typeface.CreateFromAsset(Assets,"Fonts/Roboto.ttf");
simpleButton.BackgroundColor = Color.Orange;
simpleButton.DisabledBackgroundColor = Color.LightGray;
simpleButton.PressedBackgroundColor = Color.Blue;
simpleButton.TextColor = Color.Red;
simpleButton.RippleColor = Color.Gray;
simpleButton.Click+=async(s,e)=>
{
    simpleButton.StartProgressAnimation();
    awaitTask.Delay(5000);
    simpleButton.StopProgressAnimation();
};

Sample for creating SimpleButton in axml markup for Android:

<EOS.UI.Droid.Controls.SimpleButton
    android:id="@+id/simpleButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Simple Button" />

Note: For customization Typeface you should add a file with a custom font to assets.

iOS

For iOS SimpleButton can be added from the .xib/storyboards files or from code behind.

Sample for creating SimpleButton in code behind for IOS:

var simpleButton = new SimpleButton();
simpleButton.Frame = new CGRect(0, 0, 296, 48);
simpleButton.BackgroundColor = UIColor.Orange;
simpleButton.DisabledBackgroundColor = UIColor.LightGray;
simpleButton.PressedBackgroundColor = UIColor.Blue;
simpleButton.TextColor = UIColor.Blue;
simpleButton.FontStyle = new FontStyleItem() {
    Color = ColorExtension.FromHex(MyFontColor),
    Font = UIFont.SystemFontOfSize(13f, UIFontWeight.Semibold),
    Size = 13f,
    LetterSpacing = -0.6f,
    LineHeight = 15f
}
simpleButton.ShadowConfig = new ShadowConfig(){
    Color = UIColor.Black.CGColor,
    Offset = new CGSize(0, 12),
    Blur = 5,
    Spread = 100
}