decimal to binary converter and binary to decimal conversion app using flutter
Tags: flutter, dart
Published: 2023-06-10 10:02:55


For Explanation watch video

{% embed https://youtu.be/qtpKdd4Z4ao %}

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/amvd2qbvu84uwck5urz3.png)

main.dart

```
import 'package:flutter/material.dart';
import './binary_to_decimal.dart';
import './decimal_to_binary.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        // This is the theme of your application.
        //
        // Try running your application with "flutter run". You'll see the
        // application has a blue toolbar. Then, without quitting the app, try
        // changing the primarySwatch below to Colors.green and then invoke
        // "hot reload" (press "r" in the console where you ran "flutter run",
        // or simply save your changes to "hot reload" in a Flutter IDE).
        // Notice that the counter didn't reset back to zero; the application
        // is not restarted.
        primarySwatch: Colors.blue,
      ),
      home: Converter(),
    );
  }
}

class Converter extends StatelessWidget {
  const Converter({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Converter App'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: () {
                Navigator.of(context).push(
                    MaterialPageRoute(builder: (context) => BinaryToDecimal()));
              },
              child: Text(
                'Binary To Decimal',
                style: TextStyle(
                  fontSize: 30,
                ),
              ),
            ),
            SizedBox(
              height: 30,
            ),
            ElevatedButton(
              onPressed: () {
                Navigator.of(context).push(
                    MaterialPageRoute(builder: (context) => DecimalToBinary()));
              },
              child: Text(
                'Decimal To Binary',
                style: TextStyle(
                  fontSize: 30,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

```

binary_to_decimal.dart

```
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter/src/widgets/placeholder.dart';

class BinaryToDecimal extends StatefulWidget {
  const BinaryToDecimal({super.key});

  @override
  State<BinaryToDecimal> createState() => _BinaryToDecimalState();
}

class _BinaryToDecimalState extends State<BinaryToDecimal> {
  TextEditingController binaryNumberController = TextEditingController();

  //create the variable that will store decimal number
  int decimalNumber = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Binary TO Decimal'),
      ),
      body: Container(
        padding: EdgeInsets.all(30),
        child: Column(
          children: [
            TextField(
              controller: binaryNumberController,
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: 'Enter Binary Number',
              ),
            ),
            SizedBox(
              height: 30,
            ),
            ElevatedButton(
              onPressed: () {
                //on pressing convert
                //we have to writer logic
                //to vonvert binary to decimal
                setState(() {
                  decimalNumber =
                      int.parse(binaryNumberController.text, radix: 2);
                });
              },
              child: Text(
                'Convert',
                style: TextStyle(
                  fontSize: 30,
                ),
              ),
            ),
            SizedBox(
              height: 30,
            ),
            //here we will show decimal on screen
            Text(
              'Decimal Number: ' + decimalNumber.toString(),
              style: TextStyle(
                fontSize: 30,
              ),
            ),
          ],
        ),
      ),
    );
  }
}


```

decimal_to_binary.dart

```
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter/src/widgets/placeholder.dart';

class DecimalToBinary extends StatefulWidget {
  const DecimalToBinary({super.key});

  @override
  State<DecimalToBinary> createState() => _DecimalToBinaryState();
}

class _DecimalToBinaryState extends State<DecimalToBinary> {
  //first we will create controller
  TextEditingController deimalNumberController = TextEditingController();

  //create vairable to store the binary String
  String binaryNumber = "000";
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Decimal TO Binary'),
      ),
      body: Container(
        //give some padding
        padding: EdgeInsets.all(30),
        child: Column(
          children: [
            //first we will create textfield
            //to take the use input
            TextField(
              //give controller
              controller: deimalNumberController,
              //label text and border for field
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: 'Enter Decimal Number',
              ),
            ),
            //create the sized box for
            //space between field and button
            SizedBox(
              height: 30,
            ),
            //create the convert button
            ElevatedButton(
              onPressed: () {
                //here we have to writer
                //logic to convert binary to decimal
                setState(() {
                  binaryNumber =
                      int.parse(deimalNumberController.text).toRadixString(2);
                });
              },
              child: Text(
                'Convert',
                style: TextStyle(
                  //increase the font
                  fontSize: 30,
                ),
              ),
            ),
            //write text widget to display bin number
            SizedBox(
              height: 30,
            ),
            Text(
              'Binary Number : ' + binaryNumber,
              style: TextStyle(
                fontSize: 30,
              ),
            ),
          ],
        ),
      ),
    );
  }
}


```


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fjuz2iw256mif1xcr3ez.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tn7w6p1kv3hx3orcydag.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/38octdbj2hwwa7h8gil7.png)