Flutter ચોક્કસ તત્વ તરફ નિર્દેશ કરતા તીર સાથે પોપઅપ બનાવવા માટે, તમે પેકેજમાંથી Popover
વિજેટનો ઉપયોગ કરી શકો છો popover
. તમે તે કેવી રીતે કરી શકો તે અહીં છે:
popover
તમારી ફાઇલમાં પેકેજ ઉમેરો pubspec.yaml
:
dependencies:
flutter:
sdk: flutter
popover: ^0.5.0
જરૂરી પેકેજો આયાત કરો:
import 'package:flutter/material.dart';
import 'package:popover/popover.dart';
વિજેટનો ઉપયોગ કરો Popover
:
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Popover Example'),
),
body: Center(
child: Popover(
child: ElevatedButton(
onPressed:() {},
child: Text('Open Popup'),
),
bodyBuilder:(BuildContext context) {
return Container(
padding: EdgeInsets.all(10),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text('This is a popover with an arrow.'),
SizedBox(height: 10),
Icon(Icons.arrow_drop_up, color: Colors.grey),
],
),
);
},
),
),
);
}
}
આ ઉદાહરણમાં, Popover
વિજેટનો ઉપયોગ બટનથી સામગ્રી તરફ નિર્દેશ કરતા તીર સાથે પોપઓવર બનાવવા માટે થાય છે. પ્રોપર્ટી એ child
તત્વ છે જે પોપઓવરને ટ્રિગર કરે છે અને bodyBuilder
પ્રોપર્ટી એ કોલબેક છે જે પોપઓવરની સામગ્રી પરત કરે છે.
તમારી જરૂરિયાતો અનુસાર પોપઓવરની સામગ્રી, દેખાવ અને વર્તનને કસ્ટમાઇઝ કરવાનું યાદ રાખો. popover
આ ઉદાહરણ એરો સાથે પોપઓવર બનાવવા માટે પેકેજનો ઉપયોગ દર્શાવે છે Flutter.