Question 257568 in Flutter Question posted in
The official Flutter documentation can be found here.

Flutter becoming opaque divider

Photo

I want to make a divider that becomes opaque in Flutter, but I couldn’t find how to do this. I tried to do it with the Opacity widget, but I couldn’t succeed. If anyone can send me the code, I would be happy.

Tags:

2

Answers


  1. 0

    This will do the job:

      Container(
            decoration: const BoxDecoration(
                gradient: LinearGradient(colors: [Colors.white, Colors.transparent])),
            height: 1,
            width: double.infinity),

    And you can put it inside the Expanded widget in your case then you no need to give the width.

    Login or Signup to reply.
  2. 0

    It looks like you are looking for a gradient. To make something like your image you could do this:

    import 'package:flutter/material.dart';

void main() => runApp(const MaterialApp(home: HomePage()));

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Stack(alignment: Alignment.center, children: [
          Container(
              height: 1,
              decoration: const BoxDecoration(
                  gradient: LinearGradient(
                colors: [
                  Colors.grey,
                  Colors.transparent,
                  Colors.transparent,
                  Colors.grey,
                ],
              ))),
          const Text('veya')
        ]),
      ),
    );
  }
}

    Output:

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search