I am using a custom app bar and page view. I am trying to decrease the space between SortAndFilterRow and LibraryTabScreen. I don't use padding or margin or anything else that increases the space between the two of them. I tried using the Flexible widget instead of Expanded for wrapping the page view. This is the LibraryScreen page:
import 'package:feauthor/LibraryScreen/LibraryTabScreen.dart';
import 'package:feauthor/LibraryScreen/SortAndFilterRow.dart';
import 'package:feauthor/MainScreen/MainScreen.dart';
import 'package:flutter/material.dart';
class LibraryScreen extends StatefulWidget {
const LibraryScreen({super.key});
@override
_LibraryScreenState createState() => _LibraryScreenState();
}
class _LibraryScreenState extends State<LibraryScreen> {
PageController _pageController = PageController();
int _selectedIndex = 0;
void _onPageChanged(int index) {
setState(() {
_selectedIndex = index;
});
}
void _onTabTapped(int index) {
_pageController.animateToPage(
index,
duration: Duration(milliseconds: 300),
curve: Curves.easeInOut,
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color(0xFFF4F4F4),
body: Column(
children: [
SizedBox(height: 40), // space for app bar height
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GestureDetector(
onTap: () => _onTabTapped(0),
child: Text(
'KUTUPHANEM',
style: TextStyle(
fontFamily: 'Roboto',
fontWeight: FontWeight.bold,
fontSize: 20,
color: _selectedIndex == 0 ? Colors.black : Color(0xFFC8C8C8),
),
),
),
GestureDetector(
onTap: () => _onTabTapped(1),
child: Text(
'INDIRILENLER',
style: TextStyle(
fontFamily: 'Roboto',
fontWeight: FontWeight.bold,
fontSize: 20,
color: _selectedIndex == 1 ? Colors.black : Color(0xFFC8C8C8),
),
),
),
],
),
),
SizedBox(height: 24),
Padding(
padding: const EdgeInsets.only(left: 20, right: 20),
child: SortAndFilterRow(),
),
Expanded(
child: PageView(
controller: _pageController,
onPageChanged: _onPageChanged,
children: [
// library page content
LibraryTabScreen(),
// downloaded page content
Center(child: Text('İndirilenler İçeriği')),
],
),
),
],
),
);
}
@override
void dispose() {
_pageController.dispose();
super.dispose();
}
}
void main() => runApp(MaterialApp(
home: LibraryScreen(),
));
And this is the LibraryTabScreen page:
import 'package:flutter/material.dart';
class LibraryTabScreen extends StatefulWidget {
const LibraryTabScreen({super.key});
@override
State<LibraryTabScreen> createState() => _LibraryTabScreenState();
}
class _LibraryTabScreenState extends State<LibraryTabScreen> {
@override
Widget build(BuildContext context) {
return Column(
children: [
SizedBox(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height * 0.7326, // value is changeable later
child: ListView.builder(
scrollDirection: Axis.vertical,
itemCount: 20,
itemBuilder: (context, index) {
return Container(
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(color: Color(0xFF7A7A7A)),
top: index == 0 ? BorderSide(color: Color(0xFF7A7A7A)) : BorderSide.none,
),
),
child: Row(
children: [
Padding(
padding: const EdgeInsets.only(left: 12),
child: SizedBox(
width: 56,
height: 87,
child: Image.asset(
'assets/images/examplebook.jpg',
fit: BoxFit.fill,
),
),
),
SizedBox(width: 12),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
"WHAT WE SET IN MOTION",
style: TextStyle(
fontFamily: 'Roboto',
fontWeight: FontWeight.bold,
fontSize: 20,
color: Color(0xFF000000),
),
),
],
),
SizedBox(height: 12),
Row(
children: [
Text(
"STEPHANİE AUSTİN EDWARDS",
style: TextStyle(
fontFamily: 'Roboto',
fontWeight: FontWeight.normal,
fontSize: 15,
color: Color(0xFF000000),
),
),
],
),
SizedBox(height: 24),
Row(
children: [
Text("Sayfa"),
],
),
],
),
],
),
);
},
),
),
],
);
}
}
and this is my shortandfilterrow class codes
class SortAndFilterRow extends StatefulWidget {
const SortAndFilterRow({super.key});
@override
State<SortAndFilterRow> createState() => _MyWidgetState();
}
class _MyWidgetState extends State<SortAndFilterRow> {
@override
Widget build(BuildContext context) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Icon(Icons.filter_list_sharp, color: Colors.black, size: 30),
TextButton(
onPressed: () {
// Filter operation
},
child: const Text(
"Filtrele",
style: TextStyle(
fontFamily: 'Roboto',
fontWeight: FontWeight.bold,
fontSize: 20,
color: Color(0xFF000000),
),
),
),
],
),
Row(
children: [
Icon(Icons.sort, color: Colors.black, size: 30),
TextButton(
onPressed: () {
// Sort operation
},
child: const Text(
"Sırala",
style: TextStyle(
fontFamily: 'Roboto',
fontWeight: FontWeight.bold,
fontSize: 20,
color: Color(0xFF000000),
),
),
),
],
)
],
);
}
}```
hi guys i found the reason of the issue. I recieved this error because i didnt used the fulls creen mode in my app. I added this code block and the space has been removed :
SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky,
overlays: [SystemUiOverlay.bottom]);//for full screen app