Description:

text responsive

Overview #
The TextResponsiveWidget is designed to handle scenarios where you want to prevent text overflow without explicitly setting a fixed font size. It calculates and adjusts the font size of the provided Text widget to fit within the available space defined by the parent widget.
Usage #
TextResponsiveWidget
Wrap your Text widget with TextResponsiveWidget to ensure responsive text sizing. Optionally, provide an overflowCallback to be notified when overflow is detected and the font size is adjusted.
ParagraphTextWidget & InlineTextWidget
Use these widgets for paragraph or inline text scenarios respectively. They offer the same responsive functionality with a focus on their specific text use cases.
import 'package:flutter/material.dart';
import 'package:text_responsive/text_responsive.dart';
void main() {
runApp(const MyApp());
}

class MyApp extends StatelessWidget {
const MyApp({super.key});

@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
// Use ParagraphTextWidget for paragraph text
SizedBox(
width: MediaQuery.of(context).size.width * 0.8,
height: MediaQuery.of(context).size.height * 0.4,
child: const ParagraphTextWidget(
'In Flutter, the adaptability of a paragraph to its container is crucial for creating responsive and user-friendly applications. This flexibility ensures that text content optimally fits within varying screen sizes and orientations, enhancing readability and user experience. By automatically adjusting to the container, the paragraph prevents overflow issues and maintains a clean, professional layout. This adaptability is especially important in a mobile-first world, where users access content on a diverse range of devices with different screen dimensions. In summary, an adaptable paragraph in Flutter is key to delivering a seamless and accessible app interface.',
style: TextStyle(fontSize: 20),
),
),
// Use InlineTextWidget for inline text
const InlineTextWidget(
'Your inline text here',
style: TextStyle(fontSize: 20),
),
]),
),
),
);
}
}
copied to clipboard
Simply wrap your Text widget with TextResponsiveWidget to ensure responsive text sizing. Optionally, you can provide an overflowCallback to be notified when overflow is detected and the font size is adjusted.
Features

Automatically adjusts font size to fit available space.
Prevents text overflow without explicitly setting a fixed font size.
Optional callback function when overflow is detected.

Installation #
Add the following to your pubspec.yaml:
dependencies:
text_responsive: ^latest_version
copied to clipboard
Then run:
dart pub get
copied to clipboard
For more details, refer to the installation guide.
API Reference
TextResponsiveWidget
Constructor

const TextResponsiveWidget({
required this.child,
this.overflowCallback,
Key? key,
});
copied to clipboard
Parameters
child: The text to be displayed and made responsive.
overflowCallback: An optional callback function called when overflow is detected.
copied to clipboard
Methods
calculateFontSizeToFit: Calculates the font size to fit the available space.
copied to clipboard
Contributing #
Feel free to contribute to this project by opening issues or pull requests.
License #
This project is licensed under the MIT License - see the LICENSE file for details.

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Share

• Share on Facebook
• Share on Twitter