Syncfusion Feedback

Controls
  • Grids
    • Data Grid
    • Tree Grid
    • Spreadsheet
    • Pivot Table
  • Data Visualization
    • Charts
    • Stock Chart
    • Circular Gauge
    • Diagram
    • Maps
    • Bullet Chart
    • Kanban Board
    • Sparkline Charts
    • Charts
    • 3D Circular Charts
    • Linear Gauge
    • HeatMap Chart
    • TreeMap
  • Forms
    • Query Builder
  • Notification
    • Toast
    • Message
    • Skeleton
  • Editors
    • Rich Text Editor
    • Word Processor
    • Image Editor
  • Buttons
    • Button
  • Calendars
    • Scheduler
    • Gantt Chart
    • Calendar
    • DatePicker
    • DateRangePicker
    • DateTime Picker
    • TimePicker
  • DropDowns
    • AutoComplete
    • ComboBox
    • DropDownList
    • DropDown Tree
    • MultiSelect Dropdown
    • ListBox
    • Mention
  • Layout
    • ListView
    • Card
    • Dialog
    • Dashboard Layout
    • Timeline
    • Splitter
    • Avatar
  • Navigation
    • AppBar
    • Breadcrumb
    • Carousel
    • Menu Bar
    • Tabs
    • Sidebar
    • Toolbar
    • TreeView
    • File Manager
    • Context Menu
    • Accordion
    • Stepper
  • Inputs
    • Numeric Textbox
    • File Upload
    • Color Picker
    • Signature
    • Input Mask
    • Slider
    • In-place Editor
    • Rating
    • OTP Input
    • TextBox
    • Radio Button & Checkbox
    • TextArea
  • Smart Components
    • Smart TextArea
  • Interactive Chat
    • AI AssistView
  • General
    • Angular UI Kit

Angular Signature - Tutorial Videos

Go Back
thumbnail image

Watch video

Getting Started with the Angular Signature Pad Component

See how easily you can create and configure the Angular Signature Pad component of Syncfusion. This video explains how to use the Syncfusion Angular Signature Pad component that allows users to draw smooth signatures as vector outline strokes using variable-width Bezier curve interpolation. You will see how to change the stroke width, color, and add a background color and image to the signature pad. You will also see how to save and clear the signature.

Topics included
1. Introduction 00:00 min
2. Create an Angular project using CLI 00:36 min
3. Add the Signature component with relevant modules 01:36 min
4. Change stroke width and color 03:09 min
5. Set a background color 03:46 min
6. Set a background image 04:00 min
7. Add save and clear buttons 04:28 min
Plaform: Angular Show more
thumbnail image

Watch video

How to Integrate the Angular Signature Pad with a Toolbar

Learn how to integrate the Angular Signature Pad with the Toolbar component. You'll also see how to add toolbar items such as save with background, background color, stroke color, stroke width, clear, and more.

Download Example: Integrate the Angular Signature Pad with a Toolbar

Topics included
1. Introduction 00:00 min
2. Integrate the Angular Toolbar with the Signature Pad 00:52 min
3. Undo, redo, and clear signatures 01:47 min
4. Change the stroke color 02:55 min
5. Change the background color 06:18 min
6. Change the stroke width 07:49 min
7. Save the Signature 09:36 min
8. Disable the Signature Pad 11:45 min
Plaform: Angular Show more
Chat with us