Create Horizontal Divider line with OR Text between Views Widget

Flutter has given us a inbuilt widget named as Divider which is used to create horizontal divider line between views. Sometimes we have seen a Login form where the Sign In form present first then the OR text in middle of horizontal line and just the below the OR text we have seen a Sing in With Google or Sign in With Facebook button. This type of view mostly used to give the choice to app user to choose between above task or below. So in this tutorial we would Create Horizontal Divider line with OR Text between Views Widget example.

Contents in this project Create Horizontal Divider line with OR Text between Views Widget:

1. Import material.dart package in your app’s main.dart file.

2. Create void main runApp() method and call MyApp main class here.

3. Create our main class named as MyApp extends with State less widget.

4. Create Widget build area in MyApp class. In this class we would make the default Scaffold widget with App bar widget. The scaffold widget is our main root structure widget with basic design for app.

5. Inside the Center widget first we would put a Root Column widget. The Column widget is our main Parent view.

6. Now we would make another Column widget in Root Column widget. This view is our Divider line above widget view.

7. Create a Row widget After Column Widget. Inside the Row widget we would put 2 Divider widget with 1 Text widget.

8. Create another Column widget after Row widget. This is our Divider line below view.

9. Complete source code for main.dart file:

Screenshot:

Create Horizontal Divider line with OR Text between Views Widget

Leave a Reply

Your email address will not be published. Required fields are marked *