ஒரு குறிப்பிட்ட உறுப்பை சுட்டிக்காட்டும் அம்புக்குறியுடன் பாப்அப்பை உருவாக்க, தொகுப்பிலிருந்து விட்ஜெட்டைப் 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.