Giter Site home page Giter Site logo

eopeter / flutter_dialpad Goto Github PK

View Code? Open in Web Editor NEW
26.0 4.0 33.0 1.11 MB

A Phone Dialpad for your Flutter Application

License: BSD 3-Clause "New" or "Revised" License

Dart 89.78% Kotlin 0.26% Ruby 3.96% Swift 0.74% Objective-C 0.07% Shell 1.78% HTML 3.40%

flutter_dialpad's Introduction

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

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.