I have a SliverAppBar
with some elements inside, check the 3 images where I resize the app window smaller and smaller.
I would like to avoid the texts and icons from going above the BackButton
, is there a way to do that?
Here there is a piece of my simple code:
CustomScrollView(
primary: true,
slivers: <Widget>[
const SliverAppBar(
backgroundColor: Colors.black,
pinned: true,
title: Text(
'Home',
style: TextStyle(color: Colors.white),
),
leading: BackButton(
color: Colors.white,
),
actions: <Widget>[
Icon(
Icons.person,
color: Colors.white,
),
Flexible(
child: Text(
'text1',
maxLines: 1,
style: TextStyle(color: Colors.white),
),
),
SizedBox(
width: 10,
),
Icon(
Icons.tsunami,
color: Colors.white,
),
Flexible(
child: Text(
'text2',
maxLines: 1,
style: TextStyle(color: Colors.white),
),
),
SizedBox(
width: 10,
),
],
),
),
Thanks in advance!
*Note: my code doesn't produce errors and I understand that probably it will never happen in a device where the text and icons are above the BackButton but still I would like to know if there is a way to avoid it.
You can restrict the window size of your app specially if it runs on windows or macOS:
You can use packages like window_manager
and set the minimum with of the screen
dependencies:
window_manager: ^0.3.8
void main() {
WidgetsFlutterBinding.ensureInitialized();
if (Platform.isWindows) {
setWindowMinSize(const Size(512, 384));
Future<Null>.delayed(Duration(seconds: 1), () {
setWindowFrame(Rect.fromCenter(center: Offset(1000, 500), width: 600, height: 1000));
});
}
runApp(MyApp());
}
That will never let the user minimize the app screen less than 512px, and your app bar never get shrinked.