Search packages, repositories and app categories

flutter_dialpad cover
Package detailsv1.0.5

flutter_dialpad

A phone dialer widget that can be added to any Flutter Application to enable ability to dial a number. This could be combined with a voip application to enable placing calls.

AndroidiOSWeb
30-day downloads
218
Likes
37
Pub points
125

Install package

flutter pub add flutter_dialpad

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

A Flutter widget that provides a phone dialer interface, enabling users to input and dial phone numbers within any Flutter application. Designed for integration with VoIP services or telephony features, it supports standard dial pad functionality across Android, iOS, and Web platforms. The package is lightweight and customizable, allowing developers to embed calling capabilities seamlessly into their apps. It includes a clean, responsive keypad layout optimized for touch interactions.

Use cases

  • Integrating a dialer into VoIP applications
  • Adding phone number input in communication apps
  • Enabling call initiation in customer support tools
  • Building telephony features for web and mobile apps

Key features

  • Responsive dial pad UI
  • Cross-platform compatibility (Android, iOS, Web)
  • Simple integration with existing Flutter projects
  • Customizable key layout and styling
  • Supports number input and call triggering
  • Built-in touch feedback and UX optimizations

Suitable for

  • Developers building VoIP or communication apps
  • Apps requiring phone number entry and call functionality
  • Projects targeting multiple platforms with consistent UI
  • Teams wanting a lightweight dialer solution

Considerations

  • Requires external logic to handle actual call initiation
  • Does not include audio or network call management
  • Platform-specific permissions may be needed for calling
  • Limited to UI; backend call handling must be implemented separately

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

flutter_dialpad

A phone dialer widget that can be added to any Flutter Application to enable the ability to dial a number. This could be combined with a VoIP application to enable placing calls.

This is a purely Dart widget with no dependency on Android or iOS except for the flutter_dtmf package it uses for DTMF tone generation on pressing a button. You can turn it off by setting enableDtmf: false

Getting Started

@override  
  Widget build(BuildContext context) {  
    return Scaffold(  
      backgroundColor: Colors.black,  
      body: SafeArea(  
        child:  
            DialPad(  
                // temporarily disabled  
                // enableDtmf: true,  
                outputMask: "(000) 000-0000",  
                backspaceButtonIconColor: Colors.red,  
                makeCall: (number){  
                    print(number);  
                }  
            )  
        ),  
    );  
  }  

Pre-built UIs

Support has been added for custom UIs, using Dialpad.ios for iOS style keypad or DialPad.metro metro theme. Additional customization is available with many different options.

UI Scaling

A few considerations:

ScalingType

DialPad supports dynamic scaling of UI. Using either a ScalingType.fixed approach will use preset text & icon sizes. If you are using flutter_web_frame with some window constraints, you may wish to use ScalingType.height. For most cases ScalingType.min should suffice.

ScalingSize

Scaling Size provides an easy way to specify the scalar multiplier for the scaling calculation. Instead of using a predefined value of e.g. 0.001, the ScalingSize.small is now used. Customization for buttons allows making the dial button large with a small backspace button.

Scalable

If you wish to add your own Scalable button, feel free to create a widget with Scalable to make use of the rescale function.

Clamping

Scaled UI elements may become extremely small, using minScalingSize and maxScalingSize you can clamp the scaling to a percentage of the original size. This is useful for ensuring the UI is still usable.

Screenshots

iOS Screenshot Android Screenshot
iOS Screenshot Android Screenshot

To Do

[Done] Add DTMF Tones

  • Shrink Ouput to Fit
  • Support for Local Numbers in Text Input Mask

Categories

Dependencies

Dependency list 2 items

Source repository

Projects using this package

No data available yet.