ProfileAvatarsTitleComponent

ProfileAvatarsTitleComponent

<profileAvatarsTitle> • javadoc

Synopsis

A component intended to be used as the form title that displays the profile avatars of one or more entities. This is designed to be used in a chat-style app, but could be used anywhere that you want such a title.

Usage

Generally the <profileAvatarsTitle> tag would be placed inside the <title> tag, so that it will ge used as the form

<title>
    <profileAvatarsTitle view-model="myProfiles"/>
</title>

Attributes

avatarSize

The size of the avatar in scalar units. Default size is 0.5rem.

view-model

Reference to an EntityList containing the entities to render.

View Model

The view model should be an EntityList whose rows are entities that encapsulate the profiles to include in the title. Each row entity should include properties with the following tags:

Thing.name

Will be rendered as the name of the profile.

Thing.thumbnailUrl

The URL for the profile images.

Styles

AccountAvatarsTitleComponentText

UIID for the lable used to render the profile names.

Actions

PROFILE_AVATAR_TITLE_COMPONENT_CLICKED

Triggered when the title component is clicked.

PROFILE_AVATAR_TITLE_COMPONENT_LONG_PRESS

Action fired on long press.

PROFILE_AVATAR_CLICKED

Action fired when an individual avatar is clicked. The Entity of this event will be for the individual profile.

PROFILE_AVATAR_LONG_PRESS

Action fired when an individual avatar is long pressed. The Entity of this event will be for the individual profile.

PROFILE_AVATAR_CLICKED_MENU

Actions to display in a popup-menu when a profile avatar is clicked.

PROFILE_AVATAR_LONG_PRESS_MENU

Actions to display in a popup-menu when a profile avatar is long-pressed.

Example

<?xml version="1.0"?>
<y xsi:noNamespaceSchemaLocation="ProfileAvatarsTitleComponentSample.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
    <import>
        import com.codename1.rad.sampler.models.*;
    </import>
    <var name="profiles" type="EntityList"/>
    <script>
        /* NOTE: Creating the model here only for simplicity of sample.
            in real app you should load entity list from view model or lookup.
         */
        profiles = new EntityList();
        UserProfile george = new UserProfileImpl();
        george.setName("George");
        george.setPhotoUrl("https://weblite.ca/cn1tests/radchat/george.jpg");
        profiles.add(george);

        UserProfile kramer = new UserProfileImpl();
        kramer.setName("Kramer");
        kramer.setPhotoUrl("https://weblite.ca/cn1tests/radchat/kramer.jpg");
        profiles.add(kramer);

        UserProfile jerry = new UserProfileImpl();
        jerry.setName("Jerry");
        profiles.add(jerry);


    </script>

    <title>
        <profileAvatarsTitle view-model="profiles"/>
    </title>

    <spanLabel>The title bar at the top demonstrates a ProfileAvatarsTitleComponent</spanLabel>

</y>