flutter - 在 Flutter 中删除边框轮廓？

Question

我正在实现一个切换小部件，并试图使边框变圆，我现在似乎有边框轮廓。我不太确定如何禁用它们。

如您所见，在“Bug”旁边，您有方角轮廓。

我的代码：

Container(
      height: 30,
      decoration: BoxDecoration(
          color: Colors.grey.withOpacity(0.3),
          borderRadius: BorderRadius.all(Radius.circular(20))),
      child: ToggleButtons(
        isSelected: isSelected,
        selectedColor: Colors.orange[600],
        color: Colors.black,
        fillColor: Colors.white,
        children: <Widget>[
          Padding(
              padding: const EdgeInsets.symmetric(horizontal: 12),
              child: Text('Bug',
                  style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18))),
          Padding(
              padding: const EdgeInsets.symmetric(horizontal: 12),
              child: Text('Improvement', style: TextStyle(fontSize: 18))),
        ]

希望得到一些帮助，在此先感谢！

标签： flutterdart

Answer 1

根据您的要求，我创建了一个自定义设计，请检查并让我知道它是否有效

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    debugShowCheckedModeBanner: false,
    home: MyApp(),
  ));
}

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

class _MyAppState extends State<MyApp> {
  bool _isItemSelected = true;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Container(
          width: double.infinity,
          height: 40,
          margin: EdgeInsets.symmetric(horizontal: 10),
          decoration: BoxDecoration(
            color: Colors.grey[350],
            borderRadius: BorderRadius.circular(10),
          ),
          child: Row(
            children: [
              Expanded(
                child: GestureDetector(
                  onTap: () {
                    setState(() {
                      _isItemSelected = !_isItemSelected;
                    });
                  },
                  child: Container(
                    margin: EdgeInsets.symmetric(horizontal: 5, vertical: 5),
                    height: 35,
                    decoration: BoxDecoration(
                      color:
                          _isItemSelected ? Colors.white : Colors.transparent,
                      borderRadius: BorderRadius.circular(5),
                      boxShadow: _isItemSelected
                          ? [
                              BoxShadow(
                                color: Colors.grey.withOpacity(0.5),
                                spreadRadius: 5,
                                blurRadius: 7,
                                offset:
                                    Offset(0, 3), // changes position of shadow
                              ),
                            ]
                          : null,
                    ),
                    child: Center(
                        child: Text(
                      'Bugs',
                      style: TextStyle(
                        color: _isItemSelected
                            ? Colors.orangeAccent
                            : Colors.blueGrey,
                      ),
                    )),
                  ),
                ),
              ),
              Expanded(
                child: GestureDetector(
                  onTap: () {
                    setState(() {
                      _isItemSelected = !_isItemSelected;
                    });
                  },
                  child: Container(
                    height: 35,
                    margin: EdgeInsets.symmetric(horizontal: 5, vertical: 5),
                    decoration: BoxDecoration(
                      color:
                          !_isItemSelected ? Colors.white : Colors.transparent,
                      borderRadius: BorderRadius.circular(5),
                      boxShadow: !_isItemSelected
                          ? [
                              BoxShadow(
                                color: Colors.grey.withOpacity(0.5),
                                spreadRadius: 5,
                                blurRadius: 7,
                                offset:
                                    Offset(0, 3), // changes position of shadow
                              ),
                            ]
                          : null,
                    ),
                    child: Center(
                        child: Text(
                      "Improvements",
                      style: TextStyle(
                        color: !_isItemSelected
                            ? Colors.orangeAccent
                            : Colors.blueGrey,
                      ),
                    )),
                  ),
                ),
              ),
            ],
          ),
        )
      ],
    ));
  }
}

让我知道它是否有效。

检查我添加的图像。