英文:
i want to have borders on the left, right, and top, with a border radius applied to to top left and top right in flutter
问题
我想在Flutter中在左侧、右侧和顶部使用白色边框,并在左上角和右上角应用边框半径(如给定图像所示)
,但不想在底部应用边框(我尝试了各种方法但是...)
英文:
I want to have borders with white color on the left, right, and top, with a border radius applied to top left and top right(as the given image)
 in flutter..! do not want to apply border on bottom(I tried with everything but..)
答案1
得分: 3
你是指像这样设置容器的所有边框,除了底部边框之外?
这里底部边框的宽度为零,底部角没有边框半径。
import 'package:flutter/material.dart';
class SomeWidget extends StatelessWidget {
  const SomeWidget({super.key});
  @override
  Widget build(BuildContext context) {
    const BorderSide borderSide = BorderSide(width: 4, color: Colors.white);
    const Radius radius = Radius.circular(20);
    return Center(
      child: Container(
        height: 200,
        width: 200,
        decoration: const BoxDecoration(
          color: Colors.black,
          border: Border(
            left: borderSide,
            right: borderSide,
            top: borderSide,
            bottom: BorderSide(width: 0, color: Colors.white),
          ),
          borderRadius: BorderRadius.only(topLeft: radius, topRight: radius),
        ),
      ),
    );
  }
}
void main() {
  runApp(const MaterialApp(
    home: Scaffold(
      backgroundColor: Colors.green,
      body: SomeWidget(),
    ),
  ));
}
英文:
Do you mean something like this to have all borders except the bottom one of a container?
Here the width for the bottom border is zero and there is no border radius for the bottom corners.
import 'package:flutter/material.dart';
class SomeWidget extends StatelessWidget {
  const SomeWidget({super.key});
  @override
  Widget build(BuildContext context) {
    const BorderSide borderSide = BorderSide(width: 4, color: Colors.white);
    const Radius radius = Radius.circular(20);
    return Center(
      child: Container(
        height: 200,
        width: 200,
        decoration: const BoxDecoration(
          color: Colors.black,
          border: Border(
            left: borderSide,
            right: borderSide,
            top: borderSide,
            bottom: BorderSide(width: 0, color: Colors.white),
          ),
          borderRadius: BorderRadius.only(topLeft: radius, topRight: radius),
        ),
      ),
    );
  }
}
void main() {
  runApp(const MaterialApp(
    home: Scaffold(
      backgroundColor: Colors.green,
      body: SomeWidget(),
    ),
  ));
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。


评论