React Button - Tutorial Videos

Learn how easily you can create and configure Syncfusion React Button using the "create-react-app" command. This video explains how to configure a few of the control's basic features like adding icons, setting different button styles and types. This video also explains how easily you can bind the click event to a button component.

Download Example: Getting Started with the React Button

Learn how to create and configure the Syncfusion React Floating Action Button component using the create-react-app command. The React Floating Action Button (React FAB), an extension of the React Button is designed to enhance user interaction. This dynamic button appears in front of all screen content, serving as a primary action trigger. You can effortlessly engage your users by providing a visually prominent way to perform key actions. You will also learn how to configure a few of its basic features, such as icons, predefined styles, different button sizes, and UI customization.

Download Example: Getting Started with the React Floating Action Button

Learn how to create and configure the Syncfusion React Speed Dial component using the create-react-app command. The React Speed Dial component is an extension of the Floating Action Button and allows you to display multiple primary action buttons in linear and radial formats. In this video, you will learn how to configure a few of its basic features, like how to set targets, position options, and choose styles. You will also learn how to change the display mode to radial menu.

Download Example: Getting Started with the React Speed Dial

Learn how to create and configure the Syncfusion React Split Button component in a React application using Visual Studio Code. The React Split Button triggers a default action when the primary button is clicked and provides a list of actions when the dropdown button is clicked. In this video, you will learn how to add icons, and display them in different positions, position the pop-up menu, and set separators.

Download Example: Getting Started with the React Split Button

Learn how to create and configure the Syncfusion React Dropdown Menu component in a React application using Visual Studio Code. In general, you can use the Dropdown Menu to toggle among different contextual overlays that display a list of action items. You can display both text and images together on these action items. The component has built-in support for icons and their positioning, various sizes, separators, RTL, and UI customization. In this video, you will learn Dropdown Menu component's built-in features such as adding icons and displaying them in different positions, positioning the pop-up menu, and setting separators. I will also explain how to navigate to other webpages when a specific action item is clicked.

Download Example: Getting Started with the React Dropdown Menu