https://github.com/vaadin-component-factory/avatar
https://github.com/vaadin-component-factory/avatar
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/vaadin-component-factory/avatar
- Owner: vaadin-component-factory
- License: other
- Created: 2019-04-26T11:14:07.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2019-05-15T06:32:59.000Z (about 6 years ago)
- Last Synced: 2025-01-10T00:36:38.026Z (4 months ago)
- Language: Java
- Size: 151 KB
- Stars: 0
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Component Factory Avatar for Vaadin 10+
[Live Demo ↗](https://incubator.app.fi/avatar-demo/avatar)
[<vcf-avatar>](https://vaadin.com/directory/component/vaadin-component-factoryvcf-avatar) is a Web Component for displaying an avatar for a user, their name initials, or a placeholder icon.
# What does the component do?
Avatar displays an image or abbreviation that represents a user.
# How is it used?
An avatar is visual identifier that represents user by showing image or name abbreviation (in case image is not set).
A tooltip (enabled by default) can be enabled or disabled to display the name of the avatar when hovering over it.
The abbreviation is generated from the name initials. E.g. John Smith becomes JS.
### Vaadin Prime
This component is part of Vaadin Prime. Still, open source you need to have a valid CVAL license in order to use it. Read more at: vaadin.com/pricing
## Avatar - Image (URL)
```java
Avatar avatar = new Avatar();
avatar.setImage("https://banner2.kisspng.com/20171216/6c0/google-png-5a3554027e9924.3682726615134443545186.jpg");
```
## Avatar - Image (resources)
```java
Avatar avatar = new Avatar();
String path = IMAGE_PATH;
avatar.setImage(path,"image/png");
```
## Avatar - Name and tooltip
```java
Avatar avatar = new Avatar("John Smith");
avatar.setTooltipPosition(TooltipPosition.RIGHT);
avatar.setTooltipAlignment(TooltipAlignment.BOTTOM);
```
or
```java
Avatar avatar = new Avatar("John Smith", TooltipPosition.RIGHT, TooltipAlignment.BOTTOM);
```
## Avatar - Click listener
```java
Avatar avatar = new Avatar();
avatar.setName("Second Example abbreviation");
avatar.setTooltipPosition(TooltipPosition.BOTTOM);
avatar.setTooltipAlignment(TooltipAlignment.RIGHT);
avatar.addClickListener(clickEvent -> {
Notification notification = new Notification(
"You clicked on the avatar", 3000);
notification.open();
});
```
## Avatar - Enabling and Disabling tooltip
```java
Avatar avatar = new Avatar("Sophia Wilson");
Button actionButton = new Button("enable/disable", event -> {
avatar.setToolTipEnabled(!avatar.isToolTipEnabled());
});
```
# How to run the demo?
The Demo can be run by going to the project avatar-demo and executing the maven goal:
```mvn jetty:run```
After server startup, you'll be able find the demo at[http://localhost:8080/avatar](http://localhost:8080/avatar)
## License & Author
This Add-on is distributed under [Commercial Vaadin Add-on License version 3](http://vaadin.com/license/cval-3) (CVALv3). For license terms, see LICENSE.txt.
Component Factory Avatar is written by Vaadin Ltd.
## Setting up for development:
Clone the project in GitHub (or fork it if you plan on contributing)
```
git clone [email protected]:vaadin-component-factory/vcf-avatar.git
```
to install project to your maven repository run
```mvn install```