Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[FR] Let user pick from a list of predefined colors for selection and cursor colors. #5041

Closed
MayurSMahajan opened this issue Apr 2, 2024 · 9 comments
Closed

[FR] Let user pick from a list of predefined colors for selection and cursor colors. #5041

MayurSMahajan opened this issue Apr 2, 2024 · 9 comments
Assignees
@gustamor
Labels
good first issue for devs for the community members to claim good first issue for experienced devs for the experienced community developers to claim improvements improvements on an existing feature

Comments

@MayurSMahajan
Copy link
Collaborator

Description

Right now in the Settings, we let the user pick a hex color for the selection and cursor color options.
Non-technical users might not be familiar or comfortable with using direct hex colors.
So we should append a list of some 6-7 common colors as we have in every other color picker menu.

The Hex color option should not be removed, it offers amazing customizability.

Impact

Users who are not familiar with Hex code coloring will also have an option

Additional Context

image
@MayurSMahajan MayurSMahajan added good first issue for experienced devs for the experienced community developers to claim good first issue for devs for the community members to claim improvements improvements on an existing feature labels Apr 2, 2024
@emmggi
Copy link

emmggi commented Apr 2, 2024

We can implement color pickers from packages:

https://pub.dev/packages/flutter_colorpicker
https://pub.dev/packages/flex_color_picker

@OmprakashD20
Copy link

OmprakashD20 commented Apr 8, 2024 •
edited
Loading

Can i make this improvement?

@MayurSMahajan
Copy link
Collaborator Author

Thanks @omprakashd2023! Assigned to you.

@ekakshjanweja
Copy link
Contributor

Hey @omprakashd2023 are you still working on this?

@OmprakashD20
Copy link

@ekakshjanweja Yess, will finish within this week

@Xazin
Copy link
Contributor

Xazin commented Jun 9, 2024

@ekakshjanweja Yess, will finish within this week

Hey @OmprakashD20, I've unassigned you for now. Feel free to open a PR if you finish the improvment.

@gustamor
Copy link
Contributor

gustamor commented Jun 29, 2024 •
edited
Loading

Hi!

I'm working on this feature request and wanted to check if I can be assigned to it. I'll have a pull request ready soon.

@annieappflowy
Copy link
Collaborator

Assigned this issue to @gustamor . Thanks for helping

gustamor added a commit to gustamor/AppFlowy that referenced this issue Jul 2, 2024
@gustamor
feat: Implement color picker dialog for user color selection (AppFlow…
a3892c4 
…y-IO#5041)

- Added `flex_color_picker` dependency.
- Implemented a new color picker dialog with the following features:
  - Display Material predefined colors.
  - Include primary, accent, and shade colors, as well as a color wheel for selection.
  - Add a graphical opacity selector.
  - Enhanced the previous dialog to include an icon in a text field for opening the palette.
- Added `suffixIcon` parameter to the `_ColorSettingTextField` class, making it reactive to tap gestures.
- Utilized `ColorExtension` on the `Color` class to avoid namespace conflicts when converting colors to hexadecimal strings.
- Added translation strings to english

This commit addresses issue AppFlowy-IO#5041: [FR] Let user pick from a list of predefined colors for selection and cursor colors.
@gustamor gustamor mentioned this issue Jul 2, 2024
Merged
8 tasks
gustamor added a commit to gustamor/AppFlowy that referenced this issue Jul 4, 2024
@gustamor
feat: Implement color picker dialog for user color selection (AppFlow…
19dcc46 
…y-IO#5041)

- Added `flex_color_picker` dependency.
- Implemented a new color picker dialog with the following features:
  - Display Material predefined colors.
  - Include primary, accent, and shade colors, as well as a color wheel for selection.
  - Add a graphical opacity selector.
  - Enhanced the previous dialog to include an icon in a text field for opening the palette.
- Added `suffixIcon` parameter to the `_ColorSettingTextField` class, making it reactive to tap gestures.
- Utilized `ColorExtension` on the `Color` class to avoid namespace conflicts when converting colors to hexadecimal strings.
- Added translation strings to english

This commit addresses issue AppFlowy-IO#5041
gustamor added a commit to gustamor/AppFlowy that referenced this issue Jul 6, 2024
@gustamor
feat: Implement color picker dialog for user color selection (AppFlow…
ad178d6 
…y-IO#5041)

- Added `flex_color_picker` dependency.
- Implemented a new color picker dialog with the following features:
      - Display Material predefined colors.
      - Include primary, accent, and shade colors, as well as a color wheel for selection.
      - Add a graphical opacity selector.
      - Enhanced the previous dialog to include an icon in a text field for opening the palette.
- Added `suffixIcon` parameter to the `_ColorSettingTextField` class, making it reactive to tap gestures.
- Utilized `ColorExtension` on the `Color` class to avoid namespace conflicts when converting colors to hexadecimal strings.
- Added translation strings to english

This commit addresses issue AppFlowy-IO#5041
LucasXu0 added a commit that referenced this issue Jul 10, 2024
@gustamor @appflowy @LucasXu0
feat: choose cursor/selection color from palette or color picker #5041 (
e500c89 
#5677)

* chore: show ai service error (#5675)

* feat: Implement color picker dialog for user color selection (#5041)

- Added `flex_color_picker` dependency.
- Implemented a new color picker dialog with the following features:
  - Display Material predefined colors.
  - Include primary, accent, and shade colors, as well as a color wheel for selection.
  - Add a graphical opacity selector.
  - Enhanced the previous dialog to include an icon in a text field for opening the palette.
- Added `suffixIcon` parameter to the `_ColorSettingTextField` class, making it reactive to tap gestures.
- Utilized `ColorExtension` on the `Color` class to avoid namespace conflicts when converting colors to hexadecimal strings.
- Added translation strings to english

This commit addresses issue #5041

* feat: Implement color picker dialog for user color selection (#5041)

- Added `flex_color_picker` dependency.
- Implemented a new color picker dialog with the following features:
      - Display Material predefined colors.
      - Include primary, accent, and shade colors, as well as a color wheel for selection.
      - Add a graphical opacity selector.
      - Enhanced the previous dialog to include an icon in a text field for opening the palette.
- Added `suffixIcon` parameter to the `_ColorSettingTextField` class, making it reactive to tap gestures.
- Utilized `ColorExtension` on the `Color` class to avoid namespace conflicts when converting colors to hexadecimal strings.
- Added translation strings to english

This commit addresses issue #5041

* chore: refactor code

---------

Co-authored-by: Nathan.fooo <86001920+appflowy@users.noreply.github.com>
Co-authored-by: Lucas.Xu <lucas.xu@appflowy.io>
@LucasXu0
Copy link
Collaborator

closed as completed.

zoli added a commit to zoli/AppFlowy that referenced this issue Jul 14, 2024
@zoli
style: Merge branch 'main' into feat/board-text-direction
1e7f385 
* main: (52 commits)
  chore: improve popup menu color (AppFlowy-IO#5725)
  fix: ai chat result contains html escape text (AppFlowy-IO#5721)
  chore: bump version 0.6.4 (AppFlowy-IO#5719)
  feat: support sign-in and sign-up on Web (AppFlowy-IO#5712)
  fix: syntax error when generating translation files (AppFlowy-IO#5718)
  feat: choose cursor/selection color from palette or color picker AppFlowy-IO#5041 (AppFlowy-IO#5677)
  feat: render ai text message with appflowy_editor (AppFlowy-IO#5682)
  feat: enable debug logs in internal build (AppFlowy-IO#5713)
  chore: update yrs and appflowy collab dependencies (AppFlowy-IO#5707)
  chore: bump version 0.6.3 (AppFlowy-IO#5701)
  feat: support publish document (AppFlowy-IO#5576)
  refactor: extract chat plugin to new repo (AppFlowy-IO#5699)
  fix: take the max value of the keyboard height and the view insets bottom to make the toolbar visible  (AppFlowy-IO#5700)
  chore: use latest macos runner to build the release package (AppFlowy-IO#5686)
  fix: filter chat page when duplicating (AppFlowy-IO#5676)
  chore: show ai service error (AppFlowy-IO#5675)
  feat: sync the created view after duplicating (AppFlowy-IO#5674)
  chore: disable cloud search (AppFlowy-IO#5663)
  feat: support moving page to a space (AppFlowy-IO#5665)
  chore: update German translations (AppFlowy-IO#5640)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@gustamor gustamor

Labels
good first issue for devs for the community members to claim good first issue for experienced devs for the experienced community developers to claim improvements improvements on an existing feature
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
8 participants
@LucasXu0 @annieappflowy @Xazin @emmggi @MayurSMahajan @ekakshjanweja @OmprakashD20 @gustamor