CODEWITHSUNDEEP
flutter
Vivek Sharma
Vivek Sharma

Reputation: 1

How to add widget/text to the border of a container?

I am looking to add some text to the border of the container so as to serve as a help text for the contents of the container. I am new to flutter, can someone help here.

Upvotes: 0

Views: 1018

Answers (1)

Viren V Varasadiya
Viren V Varasadiya

Reputation: 27177

there is no any direct method to do so. you have to use Stack and Positioned Widget to achieve.

Here i demonstrated how you can use.

import 'package:flutter/material.dart';

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

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

class _MyAppState extends State<MyApp> {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Demo',
        home: Scaffold(
          appBar: AppBar(
            title: Text('Demo'),
          ),
          body: Stack(
            children: <Widget>[
              SafeArea(
                child: Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Stack(
                    children: <Widget>[
                      Column(
                        children: <Widget>[
                          Expanded(
                            child: Container(
                              decoration: BoxDecoration(border: Border.all(style: BorderStyle.solid,color: Colors.red,width: 5.0)),
                              child: Center(
                                child: Text("hello world"),
                              ),
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
              ),
              Positioned(
                  top: 0.0,
                  left: 20.0,
                  child: Container(
                    child: new Text("comment",style: TextStyle(fontSize: 20.0),),
                    color: Colors.white,
                  )
              ),
            ],
          ),
        ));
  }
}

Upvotes: 2

Related Questions