Relative Border Sized Widget

A pretty simple widget that adjusts the border size/radius according to the constraints.

Features

  • Adjusts the radius according the constraints.
  • Adjusts the border according the constraints.

THIS WIDGET CANNOT ADJUST EACH AND EVERY BORDER WITH DIFFERENT WIDTH. Please view this PR.

Getting started

Install using:

 $ flutter pub add relative_border_sized_widget

Usage

Here is a short example:

import 'package:flutter/material.dart';
import 'package:relative_border_sized_widget/relative_border_sized_widget.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Homepage(),
    );
  }
}

class Homepage extends StatelessWidget {
  const Homepage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: RelativeBorderSizedWidget(
        // A callback that describes what to do when the constraints changes
        buildBoxDecoration: (BoxConstraints constraints) {
          double borderRelative = 0.07; // In this case I choose 7% of the max height

          return BoxDecorationDataclass.all(
            radius: const Radius.circular(50), // You can make the radius adjustable as well
            borderSide: BorderSide(
              color: Colors.red,
              width: borderRelative * constraints.maxHeight,
            ),
          );
        },
        child: const Text(
          "Hello",
          style: TextStyle(fontSize: 150),
        ),
      ),
    );
  }
}

Additional information

My first package. This was used in a specific setup, so it might not be fit for you.