我正在嘗試解決我有UI一個想法flutter的問題，但我不知道如何去做。
基本上，我在想象一種容器，它覆寫了一半的螢屏，并且可以向上拖動，所以把后面的資訊覆寫起來，以便顯示更多這個可拖動容器隱藏的資訊，如下圖所示。
I had tried using showModalBottomSheet, as indicated here, solution but it does not meet the requirements of my idea, mainly because it does not remain visible in a portion of the screen, and also as it starts from the bottom of the screen it hides the icons of the menu bar, plus because it is a modal completely darken the container that is below it which does not look very good, it should only give the illusion that it is a little above it.
It does not necessarily have to cover all the content of the container below it can go up to a limit, I know it is an open problem but I have no clue on how to get this idea in flutter since I have little experience, I would appreciate if someone could give me some point how address this problem.
uj5u.com熱心網友回復：
似乎是你想要的DraggableScrollableSheet，值得注意的是，這個小部件不必一起使用showModalBottomSheet。并且根據您的需要，您可以設定minChildSize屬性以指定最小高度，例如總高度的0.5平均值。50%
例如：
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(home: MyHome()));
}
class MyHome extends StatelessWidget {
const MyHome({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('DraggableScrollableSheet'),
),
body: DraggableScrollableSheet(
initialChildSize: 0.5,
minChildSize: 0.5,
maxChildSize: 1,
builder: (context, ScrollController controller) {
return Container(
color: Colors.grey,
child: ListView.builder(
controller: controller,
itemBuilder: (_, index) => Center(child: Text('$index')),
),
);
},
),
);
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/449648.html
標籤：flutter user-interface flutter-layout