In Talkback the Tooltip would only get focus once the main view had been tabbed through.
In this PR:
- Focus is set immediately on the Tooltip once it is created in when a device is in Talkback
- Tooltip's in ANYWHERE mode are dismissed on double tap as in INSIDE mode when Talkback is turned on
- AccessibilityUtils was refactored to use extensions.
Related work items: #696071
- Replaced \#212121 with uifabric black for the Tooltip background
- Refactored Tooltip layout to use alpha transparency for the background as opposed to ARGB
- Prepended integer resources with uifabric.
This fixes a bug in the naming of the border grays. The border lighter gray was darker than border gray.
These names are swapped to fix this bug.
Related work items: #695950
- **Dropdown:** Moved `getMaxAvailableHeight` closer to the source so that it is called every time a dropdown is shown. This fixes a bug where dropdown was not resizing on scroll, which was particularly noticeable when the field had many tokens.
- **Text alignment:** The goal is now to have the label, `PersonaChipView` text, and `CountSpan` text aligned center instead of baseline. This PR accounts for `PersonaChipView` text, but center aligning `CountSpan` will be more involved.
- Added **vertical spacing for chips**
- **Drag and drop:** This functionality is now activated with a long press. This requires the use of a `GestureDetector`, which resulted in some big refactoring in how touch is handled.
Related work items: #691654
### Click api
- New `PersonaChipClickListener` that allows users to assign an onClick() event to persona chips / tokens.
- We implemented a click listener similar to this for `PersonaChipView`, but this does not work in the PeoplePicker due to the complex touch interface.
- Outlook has this click functionality implemented. For them, the token click opens the live persona card.
- Only works with `SelectDeselect` click styles because the other click styles have a deeper meaning. This is the click style Outlook uses. Our demo for `SelectDeselect` has a listener for this.
- TalkBack announces when a persona chip / token has been clicked with customizable text.
### Accessibility for selection
- When a chip is accessibility focused, Talkback reads which action is available for that chip based on it's click style and whether or not it's selected. It used to just say "Double-tap to Select" regardless of click style.
- Selected chips have new custom text read that describes the secondary action that happens on the next click, depending on click style. Secondary action could be click, deselect, or delete. Since we can't add a real secondary action, we have to describe one best we can.
Related work items: #686969
This PR removes direct references to the color `uifabric_primary` and substitutes it with the app theme color `colorPrimary` for selected states and accent colors so applications consuming Fabric Android will have those states and colors customized by their application theme.
- Updated colors to reference colorPrimary
- Removed redundant and unnecessary code
- Removed initialization of threeten library in CalendarView
- Updated month overlay text color to match Outlook's, removing the primary color and replacing it with Fabric black
Related work items: #668154
The title says it all. Should work just like before. I clean up a little code while I was in the files so that they align with other patterns we've established.
Related work items: #631352
- Added `personaChipLimit` back into the api. `TokenCompleteTextView` was missing a check to make `setTokenLimit()` work correctly, which I added in.
- Truncated persona chips will no longer disappear and be added to the `CountSpan` when they are the first persona span. To fix this, I shortened the max width for the persona span.
- Since the latest accessibility PR, it's no longer possible to cut spans via the clipboard, so that break is gone. If we some day want to add the cut feature in, it is possible, but it's big feature. Devs can limit what appears in the context menu from their app.
- Improves chip layout on orientation change.
Related work items: #686978
Checked in with design about the animation, and they wanted a smoother animation. Matching android's animation did the trick, ported it over from SnackbarContentLayout. The example I originally pulled them from was off.
Related work items: #687335
This introduces a new accessibility helper class for `ExploreByTouch`. This class allows us to create nodes and virtual views for the spans inside of `PeoplePickerTextView` so that they are discoverable in `ExploreByTouch` mode and `TalkBack`.
I added one api entry point to customize the accessibility text to keep it simple - this is now in a separate file.
Also fixed a drag and drop bug - it was too sensitive to touch.
**Future improvements / fixes:**
1. ~~Fix bugs for dropdown list virtual views - these were existing before this PR - and even before I started messing with dropdown height / layout when I added the "Search Directory" button~~
2. ~~Instead of ignoring the text view label (currently we mark it as `android:importantForAccessibility="no"`, it should be hover-able, and tapping to select should focus the edit box. This is what Gmail does - Outlook ignores the label. I think this feature will make the fields easier to navigate and to select - sometimes it's hard to select the field when it's full of persona spans.~~
3. I need to do some more investigation on how to handle "deselection", but I have the feeling it might tie into future work that exposes click events for `PersonaChip`
Related work items: #678124
Kotlin conversion of NumberPicker's `quicklyAnimateValueTo` method created incorrect values causing a bug after assigning certain end times.
- Refactored `quicklyAnimateValueTo` method to correct the bug
- Refactored `ZonedDateTime. getNumberOfDaysFrom` to calculate days from start date time
- Removed unneeded code
Related work items: #678694
This PR adds selection of date and time ranges.
- Demo updated with a button that allows the selection of a date time range as well as text views reflecting start and end date times
- Added 1200 months before and 1200 months after current date to the DateTimePicker to align with the DatePicker as well as Outlook
- Alpha ordered constants and variables
- Added TIME DisplayMode constant for scenarios where start and end dates fall on different dates aligning with Outlook
Related work items: #672218
- New flag for enabling drag and drop for `PeoplePickerTextView`s
- Drag events should maintain all relevant data for the `Persona` object so that the token can be recreated on drop. In cases where it's not clear we have a `Persona` object, I kept Outlook's `getObjectForClipDataOnDrop` method that recreates such an object if possible. You can test how this fallback works by commenting this out in `swallowPersonaChipDrop`:
```
if (localState != null && localState is IPersona)
persona = localState
```
- Fixed a bug where `avatarImageBitmap` and `avatarImageUri` were not loading for the `PersonaChipView`s
- Added emails to the example to better track data moving during drag and drop
- I left out the `View.OnDragListener` for now because it didn't seem essential - we are using `onDragEvent` instead. However, we could open this api up (can read about it [here](https://developer.android.com/guide/topics/ui/drag-drop)). If we did expose that api, I think we'd need a way to enforce that it returns false to maintain drag and drop functionality. Outlook uses the listener tell their cc and bcc fields to expand when a drag from the to field starts.
- To test Outlook's drag and drop, comment out the check for `Feature.COMPOSE_CONTACTS_DRAG_AND_DROP` on line 1507 in `ComposeActivity`.
Related work items: #671303
- Using Outlook's adjustDropDownPositionAndSize and getMaxAvailableHeight methods in ContactPickerView to resize the drop down to the available space in the view. This makes the list less jumpy, which is most noticeable when it appears above the anchor.
- Switching between portrait and landscape mode no longer dismisses the dropdown nor removes the constraint text. The dropdown also resizes smoothly to adapt. Going from landscape to portrait, the dropdown takes up the full screen, but it does this in Outlook, also.
- Removed the default drop shadow for the dropdown and replaced it with a layer-list drawable that gives it a border along the anchor.
- Refactored some dimens / color naming
Related work items: #670910
- Marked internal things `internal`
- Moved callback for item clicked event from `PersonaListAdapter` to `PersonaListView` and renamed it to `OnItemClickedListener` (also updated property names that use this callback as type)
- `DemoActivity` is now abstract and got new `contentId` and `contentNeedsScrollableContainer` properties. Sets its own title and loads its content from demo layout file.
- Demo requires `DemoActivity` as a demo class
- Converted demo fragments to demo activities (subclassing from `DemoActivity`)
- Renamed demo files: *Fragment.kt to *Activity.kt
- Renamed demo files: fragment_*.xml to activity_*.xml
- Some clean up and refactoring
Related work items: #659039
- Extends open source [TokenCompleteTextView](https://github.com/splitwise/TokenAutoComplete) (TCTV)
- Extending this class has some limitations, the important ones are listed at the top of `PeoplePickerTextView`
- Because many of Outlook's code was embedded in TCTV, a lot of it either no longer made sense or was incompatible. I've beed doing a lot of functionality testing and comparison to Outlook's ComposeActivity to make sure the behavior feels the same.
- I maintained much of the customization that the TCTV offers through the PeoplePicker api. Some aspects I locked down for consistency.
- If you start typing, a `DropDownListView` (an android component) appears showing suggestions. Choosing a suggesting will add a token to the view. You can also add a token by typing in a correctly formatted email and hitting enter.
- The demo shows the four different token / chip selection options
- Select = you can select AND delete it
- SelectDeselect = you can only select/deselect. no delete action.
- None = no selection available
- Delete = instantly delete on click, skips selection
![Screenshot_1543359007.png](https://onedrive.visualstudio.com/4dcbf0bc-c3cd-49c8-a7c3-ec1924691d9b/_apis/git/repositories/32fa6338-45ea-42a0-aca0-484938e1962a/pullRequests/206822/attachments/Screenshot_1543359007.png)
Related work items: #643287
##Style Naming
The naming standard for styles in Android is Pascal case with dot notation. Dot notation works when inheriting from another style so parent styles have been added. Where an exact one to one match exists between UIFabric styles and Android styles the style is not adjusted. Inheriting styles has the advantage of leveraging font weight, size and text colors of parent styles.
Additionally "TextAppearance" is appended to text styles as is the standard implemented in Outlook and by other Android developers.
##Theme.UIFabric
`Theme.UIFabric` has been added to declare `textColorPrimary` as well as `colorPrimary` and `colorPrimaryDark` which are used in the ToolBar and Statusbar colors, now using Fabric colors.
`textColorPrimary` is added to the application theme enabling utilization of this text color by many of the parent TextAppearance styles. As a result text color is removed many of the TextViews in **_fragment_typography.xml_**.
This theme is extended in the Demo app. Where Fabric Android is consumed this Theme can be used as a parent where properties can be added and others overriden to suit the theme of the consumer App.
##CalendarDayView Colors
Two styles, `TextAppearance.UIFabric.CalendarDay` and `TextAppearance.UIFabric.CalendarDay2` derive from the base font styles, `TextAppearance.UIFabric.Subheading` and `TextAppearance.UIFabric.Subheading2` as they all share font weight and size. However, the colors are being handled in **_calendar_week_day_text_selector.xml_** which necessitates the parent color be overriden with `@null `
##Primary Dark
Consulted with @<Jack Cowan> to add `uifabric_primaryDark`.
Related work items: #658677
- renamed DatePickerView and associated files, classes and references to use CalendarView
- removed lifecycle dependency from gradle file
Related work items: #648067
Updated to the latest Android Studio and related tools.
Android Studio 3.2.1
Gradle Plugin 3.2.1
Gradle 4.6
There is a breaking change in Gradle Plugin requiring build.gradle update.
- Calling this `PersonaChip` as design suggested there will be other `Chip` implementations. Also `Badge` means something different in android than it does in ios.
- Adds new IAvatar interface to help with all the duplicate properties we now have. Refactored AvatarView to use this and also to have more accessor properties (which is more Kotlin-y than having to call set).
- Also moved the documentation comments to the interface instead of duplicating them all over.
- Adds new xsmall AvatarSize.
- Examples should show each of the interactive states: normal, pressed, active, error, error active, and disabled.
![Screenshot_1539900895.png](https://onedrive.visualstudio.com/4dcbf0bc-c3cd-49c8-a7c3-ec1924691d9b/_apis/git/repositories/32fa6338-45ea-42a0-aca0-484938e1962a/pullRequests/193327/attachments/Screenshot_1539900895.png)
Related work items: #640378
- Refactored AvatarView, including size naming, @JvmOverloads constructors, and safer bound setting
- New `persona` package for Persona related items, seems cleaner at the moment anyway
- `PersonaView` is a compound custom view. This PR is for MVP that I discussed with Jack: `title` and `subtitle` text with single line only, horizontal layout that will be used in cells. Later I will add horizontal scroll, static layout, caption text, line wrapping, and dense text layouts.
- Setting `title` and `subtitle` with a function instead of with properties because I thought it would be cleaner for the user to pass all text related properties at once, rather than using dot notation for all of them. Right now, there are just two properties, but there will be many more in the future (caption, multi line title, multi line subtitle, dense, etc)
![Screenshot_1536859636.png](https://onedrive.visualstudio.com/4dcbf0bc-c3cd-49c8-a7c3-ec1924691d9b/_apis/git/repositories/32fa6338-45ea-42a0-aca0-484938e1962a/pullRequests/178301/attachments/Screenshot_1536859636.png)
Related work items: #621024
TemplateView is an abstract class designed for building views that have their UI defined in one or more layout files. These layout files are called templates. Once template is loaded it's added to the view as the only child. After that the view becomes a proxy and forwards onMeasure/onLayout calls to its template root view.
This approach allows to hide UI implementation details from consuming developer and easily switch from one UI to another.
@<Emily Lynam> This is what we can use later as a superclass for PersonaView.
Related work items: #624932
- AvatarView draws Avatar with initials via `setInfo` and loads Avatar with image via four overridden public methods, this view replaces AvatarDrawable and RoundedDrawable from Outlook
- I replaced Outlook's RoundedDrawble with android's RoundedBitmapDrawable, but we can easily switch back if we run into compat problems
- `setImageDrawable` intercepts calls from Glide and Picasso to set the rounded drawable, the other three methods give flexibility for setting the image on AvatarView in all the other built in ways. Added examples of most of these in the demo.
- InitialsDrawable and ThemeUtil logic is pretty much straight from Outlook. We need the ThemeUtil for setting initials backgroundcolor
- I changed the API level in gradle from 28 to 27 because 28 is still a bit buggy
![Screenshot_1535668084.png](https://onedrive.visualstudio.com/4dcbf0bc-c3cd-49c8-a7c3-ec1924691d9b/_apis/git/repositories/32fa6338-45ea-42a0-aca0-484938e1962a/pullRequests/169504/attachments/Screenshot_1535668084.png)
Related work items: #617650