Home > Mobile >  Using divider in flutter between text
Using divider in flutter between text

Time:08-16

I need to make a divider in login screen under login button i used divider and it do not work

so this is the design i need to make

enter image description here

CodePudding user response:

Row with two divider and middle one will be text

 Row(
  children: [
    Expanded(
        child: Divider(
      endIndent: 12,
    )),
    Text("Or with"),
    Expanded(
        child: Divider(
      indent: 12,
    ))
  ],
),

CodePudding user response:

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home:  Scaffold(
        body: Row(
          children: [
            Flexible(
              child: Divider() 
            ),
            Text("Or with"),
            Flexible(
              child: Divider() 
            ),
          ],
        ),
      ),
    );
  }
}

CodePudding user response:

Use this:

Container(
  color: Colors.white,//same
  child: Stack(
    alignment: Alignment.center,
    children: [
      Divider(
        thickness: 2,
      ),
      Container(
        padding: const EdgeInsets.symmetric(horizontal: 8.0),
        color: Colors.white,//same
        child: Text(
          'asdasdda  ads asd',
        ),
      )
    ],
  ),
)

use same color as background for text parent widget

  • Related