Update scrollbars

This commit is contained in:
Hillel Coren 2021-03-04 19:52:29 +02:00
parent e1794cfdb1
commit a6692f0525
8 changed files with 212 additions and 179 deletions

View File

@ -36,7 +36,7 @@ import 'package:invoiceninja_flutter/utils/platforms.dart';
import 'package:url_launcher/url_launcher.dart'; import 'package:url_launcher/url_launcher.dart';
import 'package:invoiceninja_flutter/utils/colors.dart'; import 'package:invoiceninja_flutter/utils/colors.dart';
class MenuDrawer extends StatelessWidget { class MenuDrawer extends StatefulWidget {
const MenuDrawer({ const MenuDrawer({
Key key, Key key,
@required this.viewModel, @required this.viewModel,
@ -45,6 +45,26 @@ class MenuDrawer extends StatelessWidget {
final MenuDrawerVM viewModel; final MenuDrawerVM viewModel;
static const LOGO_WIDTH = 38.0; static const LOGO_WIDTH = 38.0;
@override
_MenuDrawerState createState() => _MenuDrawerState();
}
class _MenuDrawerState extends State<MenuDrawer> {
ScrollController _scrollController;
@override
void initState() {
super.initState();
_scrollController = ScrollController();
}
@override
void dispose() {
_scrollController.dispose();
super.dispose();
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final Store<AppState> store = StoreProvider.of<AppState>(context); final Store<AppState> store = StoreProvider.of<AppState>(context);
@ -52,20 +72,21 @@ class MenuDrawer extends StatelessWidget {
final enableDarkMode = state.prefState.enableDarkMode; final enableDarkMode = state.prefState.enableDarkMode;
final localization = AppLocalization.of(context); final localization = AppLocalization.of(context);
final account = state.account; final account = state.account;
final company = viewModel.selectedCompany; final company = widget.viewModel.selectedCompany;
if (company == null) { if (company == null) {
return Container(); return Container();
} }
Widget _companyLogo(CompanyEntity company) => Widget _companyLogo(CompanyEntity company) => company
company.settings.companyLogo != null && .settings.companyLogo !=
null &&
company.settings.companyLogo.isNotEmpty company.settings.companyLogo.isNotEmpty
? CachedImage( ? CachedImage(
width: LOGO_WIDTH, width: MenuDrawer.LOGO_WIDTH,
url: account.defaultUrl + company.settings.companyLogo, url: account.defaultUrl + company.settings.companyLogo,
) )
: Image.asset('assets/images/logo.png', width: LOGO_WIDTH); : Image.asset('assets/images/logo.png', width: MenuDrawer.LOGO_WIDTH);
Widget _companyListItem(CompanyEntity company) { Widget _companyListItem(CompanyEntity company) {
final userCompany = state.userCompanyStates final userCompany = state.userCompanyStates
@ -107,12 +128,12 @@ class MenuDrawer extends StatelessWidget {
tooltip: localization.selectCompany, tooltip: localization.selectCompany,
child: SizedBox( child: SizedBox(
height: 48, height: 48,
width: LOGO_WIDTH, width: MenuDrawer.LOGO_WIDTH,
child: _companyLogo(viewModel.selectedCompany), child: _companyLogo(widget.viewModel.selectedCompany),
), ),
color: Theme.of(context).cardColor, color: Theme.of(context).cardColor,
itemBuilder: (BuildContext context) => [ itemBuilder: (BuildContext context) => [
...viewModel.state.companies ...widget.viewModel.state.companies
.map((company) => PopupMenuItem<String>( .map((company) => PopupMenuItem<String>(
child: _companyListItem(company), child: _companyListItem(company),
value: company.id, value: company.id,
@ -144,14 +165,14 @@ class MenuDrawer extends StatelessWidget {
], ],
onSelected: (String companyId) { onSelected: (String companyId) {
if (companyId == 'company') { if (companyId == 'company') {
viewModel.onAddCompany(context); widget.viewModel.onAddCompany(context);
} else if (companyId == 'logout') { } else if (companyId == 'logout') {
viewModel.onLogoutTap(context); widget.viewModel.onLogoutTap(context);
} else { } else {
final company = final company =
state.companies.firstWhere((company) => company.id == companyId); state.companies.firstWhere((company) => company.id == companyId);
final index = state.companies.indexOf(company); final index = state.companies.indexOf(company);
viewModel.onCompanyChanged(context, index, company); widget.viewModel.onCompanyChanged(context, index, company);
} }
}, },
); );
@ -159,7 +180,7 @@ class MenuDrawer extends StatelessWidget {
final _expandedCompanySelector = state.companies.isEmpty final _expandedCompanySelector = state.companies.isEmpty
? SizedBox() ? SizedBox()
: AppDropdownButton<String>( : AppDropdownButton<String>(
value: viewModel.selectedCompanyIndex, value: widget.viewModel.selectedCompanyIndex,
items: [ items: [
...state.companies ...state.companies
.map((CompanyEntity company) => DropdownMenuItem<String>( .map((CompanyEntity company) => DropdownMenuItem<String>(
@ -192,13 +213,13 @@ class MenuDrawer extends StatelessWidget {
], ],
onChanged: (dynamic value) { onChanged: (dynamic value) {
if (value == 'company') { if (value == 'company') {
viewModel.onAddCompany(context); widget.viewModel.onAddCompany(context);
} else if (value == 'logout') { } else if (value == 'logout') {
viewModel.onLogoutTap(context); widget.viewModel.onLogoutTap(context);
} else { } else {
final index = int.parse(value); final index = int.parse(value);
viewModel.onCompanyChanged( widget.viewModel
context, index, state.companies[index]); .onCompanyChanged(context, index, state.companies[index]);
} }
}, },
); );
@ -228,7 +249,11 @@ class MenuDrawer extends StatelessWidget {
: Expanded( : Expanded(
child: Container( child: Container(
color: Theme.of(context).cardColor, color: Theme.of(context).cardColor,
child: Scrollbar(
controller: _scrollController,
isAlwaysShown: isDesktop(context),
child: ListView( child: ListView(
controller: _scrollController,
shrinkWrap: true, shrinkWrap: true,
children: <Widget>[ children: <Widget>[
if (state.account.debugEnabled) if (state.account.debugEnabled)
@ -266,7 +291,8 @@ class MenuDrawer extends StatelessWidget {
context: context, context: context,
entityType: EntityType.dashboard), entityType: EntityType.dashboard),
onLongPress: () => store.dispatch(ViewDashboard( onLongPress: () => store.dispatch(ViewDashboard(
navigator: Navigator.of(context), filter: '')), navigator: Navigator.of(context),
filter: '')),
), ),
DrawerTile( DrawerTile(
company: company, company: company,
@ -364,6 +390,7 @@ class MenuDrawer extends StatelessWidget {
), ),
], ],
), ),
),
)), )),
SizedBox( SizedBox(
height: kTopBottomBarHeight, height: kTopBottomBarHeight,

View File

@ -1,6 +1,5 @@
import 'dart:async'; import 'dart:async';
import 'package:draggable_scrollbar/draggable_scrollbar.dart';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart' hide DataRow, DataCell, DataColumn; import 'package:flutter/material.dart' hide DataRow, DataCell, DataColumn;
import 'package:flutter_redux/flutter_redux.dart'; import 'package:flutter_redux/flutter_redux.dart';
@ -157,7 +156,29 @@ class _EntityListState extends State<EntityList> {
fit: FlexFit.loose, fit: FlexFit.loose,
child: entityList.isEmpty child: entityList.isEmpty
? HelpText(AppLocalization.of(context).noRecordsFound) ? HelpText(AppLocalization.of(context).noRecordsFound)
: DraggableScrollbar.semicircle( : Scrollbar(
controller: _scrollController,
isAlwaysShown: isDesktop(context),
child: ListView.separated(
padding: const EdgeInsets.symmetric(vertical: 25),
controller: _scrollController,
separatorBuilder: (context, index) =>
(index == 0 || index == entityList.length)
? SizedBox()
: ListDivider(),
itemCount: entityList.length + 2,
itemBuilder: (BuildContext context, index) {
if (index == 0 || index == entityList.length + 1) {
return Container(
color: Theme.of(context).cardColor,
height: 25,
);
} else {
return widget.itemBuilder(context, index - 1);
}
},
),
) /*DraggableScrollbar.semicircle(
backgroundColor: Theme.of(context).backgroundColor, backgroundColor: Theme.of(context).backgroundColor,
scrollbarTimeToFade: Duration(seconds: 1), scrollbarTimeToFade: Duration(seconds: 1),
controller: _scrollController, controller: _scrollController,
@ -180,7 +201,8 @@ class _EntityListState extends State<EntityList> {
} }
}, },
), ),
), )*/
,
), ),
], ],
); );

View File

@ -1,7 +1,6 @@
import 'dart:math'; import 'dart:math';
import 'package:charts_common/common.dart'; import 'package:charts_common/common.dart';
import 'package:charts_flutter/flutter.dart' as charts; import 'package:charts_flutter/flutter.dart' as charts;
import 'package:draggable_scrollbar/draggable_scrollbar.dart';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:invoiceninja_flutter/constants.dart'; import 'package:invoiceninja_flutter/constants.dart';
@ -402,10 +401,9 @@ class DashboardPanels extends StatelessWidget {
children: <Widget>[ children: <Widget>[
Padding( Padding(
padding: const EdgeInsets.only(top: 74), padding: const EdgeInsets.only(top: 74),
child: DraggableScrollbar.semicircle( child: Scrollbar(
backgroundColor: Theme.of(context).backgroundColor,
scrollbarTimeToFade: Duration(seconds: 1),
controller: scrollController, controller: scrollController,
isAlwaysShown: isDesktop(context),
child: ListView( child: ListView(
controller: scrollController, controller: scrollController,
children: <Widget>[ children: <Widget>[

View File

@ -1,4 +1,3 @@
import 'package:draggable_scrollbar/draggable_scrollbar.dart';
import 'package:invoiceninja_flutter/ui/app/forms/custom_field.dart'; import 'package:invoiceninja_flutter/ui/app/forms/custom_field.dart';
import 'package:invoiceninja_flutter/ui/app/forms/decorated_form_field.dart'; import 'package:invoiceninja_flutter/ui/app/forms/decorated_form_field.dart';
import 'package:invoiceninja_flutter/ui/app/help_text.dart'; import 'package:invoiceninja_flutter/ui/app/help_text.dart';
@ -12,6 +11,7 @@ import 'package:invoiceninja_flutter/utils/formatting.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:invoiceninja_flutter/data/models/models.dart'; import 'package:invoiceninja_flutter/data/models/models.dart';
import 'package:invoiceninja_flutter/utils/localization.dart'; import 'package:invoiceninja_flutter/utils/localization.dart';
import 'package:invoiceninja_flutter/utils/platforms.dart';
class InvoiceEditItems extends StatefulWidget { class InvoiceEditItems extends StatefulWidget {
const InvoiceEditItems({ const InvoiceEditItems({
@ -83,10 +83,8 @@ class _InvoiceEditItemsState extends State<InvoiceEditItems> {
return HelpText(localization.clickPlusToAddItem); return HelpText(localization.clickPlusToAddItem);
} }
return DraggableScrollbar.semicircle( return Scrollbar(
backgroundColor: Theme.of(context).backgroundColor, isAlwaysShown: isDesktop(context),
scrollbarTimeToFade: Duration(seconds: 1),
controller: _scrollController,
child: ListView( child: ListView(
controller: _scrollController, controller: _scrollController,
children: [ children: [

View File

@ -1,4 +1,3 @@
import 'package:draggable_scrollbar/draggable_scrollbar.dart';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:invoiceninja_flutter/constants.dart'; import 'package:invoiceninja_flutter/constants.dart';
@ -68,10 +67,8 @@ class _SettingsListState extends State<SettingsList> {
filter: settingsUIState.filter, filter: settingsUIState.filter,
); );
return DraggableScrollbar.semicircle( return Scrollbar(
backgroundColor: Theme.of(context).backgroundColor, isAlwaysShown: isDesktop(context),
scrollbarTimeToFade: Duration(seconds: 1),
controller: _scrollController,
child: ListView( child: ListView(
controller: _scrollController, controller: _scrollController,
children: <Widget>[ children: <Widget>[

View File

@ -60,7 +60,6 @@ dependencies:
contacts_service: ^0.4.6 contacts_service: ^0.4.6
extended_image: 1.3.1-dev #TODO remove extended_image: 1.3.1-dev #TODO remove
file_picker: ^2.1.1 file_picker: ^2.1.1
draggable_scrollbar: ^0.0.4
dependency_overrides: dependency_overrides:
# https://github.com/flutter/flutter/issues/70433#issuecomment-727154345 # https://github.com/flutter/flutter/issues/70433#issuecomment-727154345

View File

@ -232,13 +232,6 @@ packages:
url: "https://pub.dartlang.org" url: "https://pub.dartlang.org"
source: hosted source: hosted
version: "1.0.1" version: "1.0.1"
draggable_scrollbar:
dependency: "direct main"
description:
name: draggable_scrollbar
url: "https://pub.dartlang.org"
source: hosted
version: "0.0.4"
extended_image: extended_image:
dependency: "direct main" dependency: "direct main"
description: description:

View File

@ -74,7 +74,6 @@ dependencies:
contacts_service: ^0.4.6 contacts_service: ^0.4.6
extended_image: 1.3.1-dev #TODO remove extended_image: 1.3.1-dev #TODO remove
file_picker: ^2.1.1 file_picker: ^2.1.1
draggable_scrollbar: ^0.0.4
dependency_overrides: dependency_overrides:
# https://github.com/flutter/flutter/issues/70433#issuecomment-727154345 # https://github.com/flutter/flutter/issues/70433#issuecomment-727154345