mirror of
https://github.com/Iconica-Development/flutter_image_picker.git
synced 2025-05-18 19:53:45 +02:00
new image picker customization options
This commit is contained in:
parent
5a8d1da467
commit
c0b129d912
5 changed files with 76 additions and 16 deletions
14
CHANGELOG.md
14
CHANGELOG.md
|
@ -1,3 +1,17 @@
|
|||
## 0.0.1 - September 5th 2022
|
||||
|
||||
- Initial release
|
||||
|
||||
## 0.0.2 - September 6th 2022
|
||||
|
||||
- Camera now works in release build of application on Android
|
||||
|
||||
## 0.0.3 - September 6th 2022
|
||||
|
||||
- More customization options for the Image Picker Dialog added:
|
||||
- Font
|
||||
- Text color
|
||||
- Icon color
|
||||
- Close Button background color
|
||||
- Close Button text color
|
||||
- Close Button text size
|
|
@ -21,7 +21,10 @@ As a whole you get `ImagePicker(ImagePickerTheme(imagePickerTheme: const ImagePi
|
|||
|
||||
| Parameter | Explaination |
|
||||
|-------------------|----------------|
|
||||
| font | The font that is being used in the Image Picker Dialog. |
|
||||
| title | The title displayed at the top of the Image Picker Dialog. |
|
||||
| textColor | The color of the text that is displayed in the Image Picker Dialog. |
|
||||
| iconColor | The color of the icons that are displayed in the Image Picker Dialog. |
|
||||
| titleTextSize | The font size of the title mentioned above. |
|
||||
| iconSize | The size of the icons that are visible in the Image Picker Dialog. |
|
||||
| iconTextSize | The font size of the text underneath the icon buttons. |
|
||||
|
@ -31,8 +34,11 @@ As a whole you get `ImagePicker(ImagePickerTheme(imagePickerTheme: const ImagePi
|
|||
| selectImageIcon | The icon that is displayed for the 'Select Image From Gallery' functionality of the Image Picker Dialog. |
|
||||
| selectImageText | The text that is displayed underneath the 'Select Image From Gallery' icon. |
|
||||
| closeButtonText | The text that is shown on the 'Close Dialog' button at the bottom of the Image Picker Dialog. |
|
||||
| closeButtonTextSize | The size of the text that is being displayed on the 'Close Dialog' button at the bottom of the Image Picker Dialog. |
|
||||
| closeButtonTextColor | The color of the text that is being displayed on the 'Close Dialog' button at the bottom of the Image Picker Dialog. |
|
||||
| closeButtonWidth | The width of the 'Close Dialog' button at the bottom of the Image Picker Dialog. |
|
||||
| closeButtonHeight | The height of the 'Close Dialog' button at the bottom of the Image Picker Dialog. |
|
||||
| closeButtonBackgroundColor | The background color of the 'Close Dialog' button at the bottom of the Image Picker Dialog. |
|
||||
|
||||
|
||||
## Issues
|
||||
|
|
|
@ -96,6 +96,7 @@ class _ImagePickerExampleHomePageState
|
|||
void pickImage() async {
|
||||
Uint8List? imageInBytes = await showModalBottomSheet<Uint8List?>(
|
||||
context: context,
|
||||
backgroundColor: Colors.white,
|
||||
builder: (BuildContext context) => const ImagePicker());
|
||||
if (imageInBytes != null) {
|
||||
if (!listEquals(image, imageInBytes)) {
|
||||
|
|
|
@ -3,9 +3,12 @@ import 'package:flutter/material.dart';
|
|||
class ImagePickerTheme {
|
||||
/// The [ImagePickerTheme] is used to style the [ImagePicker].
|
||||
|
||||
const ImagePickerTheme(
|
||||
{this.title = "Upload Image",
|
||||
const ImagePickerTheme({
|
||||
this.font = "Roboto",
|
||||
this.title = "Upload Image",
|
||||
this.titleTextSize = 20,
|
||||
this.textColor = Colors.black,
|
||||
this.iconColor = Colors.black,
|
||||
this.iconSize = 125,
|
||||
this.iconTextSize = 15,
|
||||
this.spaceBetweenIcons = 30,
|
||||
|
@ -14,8 +17,15 @@ class ImagePickerTheme {
|
|||
this.selectImageIcon = Icons.image,
|
||||
this.selectImageText = "Select File",
|
||||
this.closeButtonText = "Close",
|
||||
this.closeButtonTextSize = 15,
|
||||
this.closeButtonTextColor = Colors.white,
|
||||
this.closeButtonWidth = 300,
|
||||
this.closeButtonHeight = 40});
|
||||
this.closeButtonHeight = 40,
|
||||
this.closeButtonBackgroundColor = Colors.black,
|
||||
});
|
||||
|
||||
/// The font that's used in the Image Picker
|
||||
final String font;
|
||||
|
||||
/// The title displayed at the top of the Image Picker Dialog.
|
||||
final String title;
|
||||
|
@ -23,6 +33,12 @@ class ImagePickerTheme {
|
|||
/// The font size of the title mentioned above.
|
||||
final double titleTextSize;
|
||||
|
||||
/// The color of the icons
|
||||
final Color iconColor;
|
||||
|
||||
/// The color of the text in the Image Picker Dialog
|
||||
final Color textColor;
|
||||
|
||||
/// The size of the icons that are visible in the Image Picker Dialog.
|
||||
final double iconSize;
|
||||
|
||||
|
@ -47,9 +63,18 @@ class ImagePickerTheme {
|
|||
/// The text that is shown on the 'Close Dialog' button at the bottom of the Image Picker Dialog.
|
||||
final String closeButtonText;
|
||||
|
||||
/// The fontsize of the text of the close button of the Image Picker Dialog.
|
||||
final double closeButtonTextSize;
|
||||
|
||||
/// The color of the text of the close button of the Image Picker Dialog.
|
||||
final Color closeButtonTextColor;
|
||||
|
||||
/// The width of the 'Close Dialog' button at the bottom of the Image Picker Dialog.
|
||||
final double closeButtonWidth;
|
||||
|
||||
/// The height of the 'Close Dialog' button at the bottom of the Image Picker Dialog.
|
||||
final double closeButtonHeight;
|
||||
|
||||
/// The color of the close button of the Image Picker Dialog.
|
||||
final Color closeButtonBackgroundColor;
|
||||
}
|
||||
|
|
|
@ -29,7 +29,9 @@ class ImagePicker extends StatelessWidget {
|
|||
title: Text(
|
||||
imagePickerTheme.title,
|
||||
style: TextStyle(
|
||||
fontFamily: imagePickerTheme.font,
|
||||
fontSize: imagePickerTheme.titleTextSize,
|
||||
color: imagePickerTheme.textColor,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
@ -60,8 +62,16 @@ class ImagePicker extends StatelessWidget {
|
|||
width: imagePickerTheme.closeButtonWidth,
|
||||
height: imagePickerTheme.closeButtonHeight,
|
||||
child: ElevatedButton(
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor:
|
||||
imagePickerTheme.closeButtonBackgroundColor),
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
child: Text(imagePickerTheme.closeButtonText)),
|
||||
child: Text(imagePickerTheme.closeButtonText,
|
||||
style: TextStyle(
|
||||
fontFamily: imagePickerTheme.font,
|
||||
fontSize: imagePickerTheme.closeButtonTextSize,
|
||||
color: imagePickerTheme.closeButtonTextColor,
|
||||
))),
|
||||
)
|
||||
],
|
||||
),
|
||||
|
@ -92,6 +102,7 @@ class ImagePicker extends StatelessWidget {
|
|||
key: Key(bottomText),
|
||||
icon: Icon(icon),
|
||||
iconSize: imagePickerTheme.iconSize,
|
||||
color: imagePickerTheme.iconColor,
|
||||
onPressed: () async {
|
||||
final navigator = Navigator.of(context);
|
||||
var image = await (imagePickerService ?? ImagePickerService())
|
||||
|
@ -101,7 +112,10 @@ class ImagePicker extends StatelessWidget {
|
|||
),
|
||||
Text(
|
||||
bottomText,
|
||||
style: TextStyle(fontSize: imagePickerTheme.iconTextSize),
|
||||
style: TextStyle(
|
||||
fontFamily: imagePickerTheme.font,
|
||||
fontSize: imagePickerTheme.iconTextSize,
|
||||
color: imagePickerTheme.textColor),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 20,
|
||||
|
|
Loading…
Reference in a new issue