Flidter SlidingUpPanel виджет с TextField не работает - PullRequest
Новая
       70

Flidter SlidingUpPanel виджет с TextField не работает

0 голосов
/ 01 мая 2020

Я использую виджет SlidingUpPanel, который задокументирован здесь .

Когда я использую свойство header и делаю его виджетом TextField, панель больше не скользит вверх и вниз и просто остается свернутый.

Полный код страницы приведен ниже: 

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:sliding_up_panel/sliding_up_panel.dart';

class HomePage extends StatefulWidget {

  HomePage();

  @override
  _HomePageState createState() => new _HomePageState();
}

class _HomePageState extends State<HomePage> {

  _HomePageState();

  Widget _buildSuggestions() {
    List<myObject> myObjects = _getRecentmyObjects();
    return new ListView.builder(
        itemCount: myObjects.length,
        itemBuilder: (context, index) {
          return Card(
            elevation: 2,
            child: ListTile(
              title: Text(myObjects[index].firstLine),
              subtitle: Text(
                myObjects[index].secondLine + "," + myObjects[index].thirdLine,
                maxLines: 2,
              ),
            ),
          );
        });
  }

  List<myObject> _getmyObjects() {
    return [
      new myObject(
          firstLine: "This is",
          secondLine: "one element ",
          thirdLine: "of a list of items",
          aNumber: "00000"),
      new myObject(
          firstLine: "This is a",
          secondLine: "second element of a list",
          thirdLine: "",
          aNumber: "00000"),
      new myObject(
          firstLine: "And a ", secondLine: "Third", thirdLine: "", aNumber: "000"),
    ];
  }

  PanelController _panelController = new PanelController();

  @override
  Widget build(BuildContext context) {
    BorderRadiusGeometry radius = BorderRadius.only(
      topLeft: Radius.circular(24.0),
      topRight: Radius.circular(24.0),
    );
    return Scaffold(
      body: SlidingUpPanel(
        controller: _panelController,
        minHeight: 80,
        header:  new TextField(),
        panel:
         child: Container(
            padding: const EdgeInsets.only(top: 0),
            child: Center(
              child: _buildSuggestions(),
            ),
          ),
        ]),
        body: Container(),
        borderRadius: radius,
      ),
    );
  }
}

Если я удалю параметр заголовка, виджет будет работать как положено. Почему он не скользит с TextField?

1 Ответ

1 голос
/ 02 мая 2020

header - это необязательный постоянный виджет, который располагается над [panel] и прикрепляется к верхней части [panel].

Я думаю, что вы ищете что-то вроде этого demo

Для достижения этого вы можете использовать 

Column[TextField, Flexible(child:ListView())]

Проверьте код ниже . 

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

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  HomePage();

  @override
  _HomePageState createState() => new _HomePageState();
}

class _HomePageState extends State<HomePage> {
  _HomePageState();

  Widget _buildSuggestions() {
    List<MyObject> myObjects = _getmyObjects();
    return new ListView.builder(
        itemCount: myObjects.length,
        itemBuilder: (context, index) {
          return Card(
            elevation: 2,
            child: ListTile(
              title: Text(myObjects[index].firstLine),
              subtitle: Text(
                myObjects[index].secondLine + "," + myObjects[index].thirdLine,
                maxLines: 2,
              ),
            ),
          );
        });
  }

  List<MyObject> _getmyObjects() {
    return [
      new MyObject(firstLine: "This is", secondLine: "one element ", thirdLine: "of a list of items", aNumber: "00000"),
      new MyObject(firstLine: "This is a", secondLine: "second element of a list", thirdLine: "", aNumber: "00000"),
      new MyObject(firstLine: "And a ", secondLine: "Third", thirdLine: "", aNumber: "000"),
    ];
  }

  PanelController _panelController = new PanelController();

  @override
  Widget build(BuildContext context) {
    BorderRadiusGeometry radius = BorderRadius.only(
      topLeft: Radius.circular(24.0),
      topRight: Radius.circular(24.0),
    );
    return Scaffold(
      appBar: AppBar(),
      body: SlidingUpPanel(
        borderRadius: radius,
        controller: _panelController,
        minHeight: 80,
        body: Placeholder(),
        panel: Container(
          padding: EdgeInsets.all(20.0),
          child: Column(
            children: <Widget>[
              TextField(
                decoration: InputDecoration(
                  labelText: "Search",
                ),
              ),
              Flexible(
                child: _buildSuggestions(),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class MyObject {
  String firstLine;
  String secondLine;
  String thirdLine;
  String aNumber;

  MyObject({
    this.firstLine,
    this.secondLine,
    this.thirdLine,
    this.aNumber,
  });
}

Надеюсь, это поможет:)

...