Метод vertical

Метод vertical класса BorderRadius принимает два радиуса. Верхний получают оба верхних угла, нижний получают оба нижних.

Синтаксис

BorderRadius.vertical(top: Radius.circular(24), bottom: Radius.circular(4))

Параметры

Параметр	Описание
`top`	Радиус обоих верхних углов. По умолчанию углы прямые.
`bottom`	Радиус обоих нижних углов. По умолчанию углы прямые.

Пример

Давайте скруглим верх сильнее низа:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(
					child: Container(
						padding: EdgeInsets.all(16),
						decoration: BoxDecoration(
							color: Color(0xFF1565C0),
							borderRadius: BorderRadius.vertical(
								top: Radius.circular(32),
								bottom: Radius.circular(4),
							),
						),
						child: Text('abcde'),
					)
				),
			),
		),
	);
}

На экране синяя карточка. Верхние углы круглые, нижние почти прямые.

Пример

Давайте скруглим только низ:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(
					child: Container(
						padding: EdgeInsets.all(16),
						decoration: BoxDecoration(
							color: Color(0xFFC62828),
							borderRadius: BorderRadius.vertical(bottom: Radius.circular(28)),
						),
						child: Text('12345'),
					)
				),
			),
		),
	);
}

На экране красная карточка. Скруглены нижние углы, верхние прямые.

Смотрите также

метод all,
который ставит один радиус на все четыре угла
метод only,
который скругляет только названные углы
метод horizontal,
который задаёт радиус отдельно левым и правым углам
класс BoxDecoration,
который рисует скругление в поле borderRadius