[TIMOB-28082] Android: Update "CardView" to support material theme
GitHub Issue | n/a |
---|---|
Type | Improvement |
Priority | Low |
Status | Closed |
Resolution | Fixed |
Resolution Date | 2021-03-05T15:57:37.000+0000 |
Affected Version/s | n/a |
Fix Version/s | Release 10.0.0 |
Components | Android |
Labels | 2020-Q4, CardView, android, breaking-change, material-theme, theme |
Reporter | Joshua Quick |
Assignee | Joshua Quick |
Created | 2020-08-13T23:35:17.000+0000 |
Updated | 2021-03-05T15:57:37.000+0000 |
Description
*Summary:*
Our [Ti.UI.Android.CardView](https://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.Android.CardView) is currently using the Java [androidx.cardview.widget.CardView](https://developer.android.com/reference/androidx/cardview/widget/CardView) class. It should be updated to use the newer [com.google.android.material.card.MaterialCardView](https://developer.android.com/reference/com/google/android/material/card/MaterialCardView) class. The newer class supports the material theme styles.
*Outlined Card:*
We should also add "outlined" CardView support without a drop-shadow. This can be done be setting the
elevation
property to 0
and setting the borderColor
and borderWidth
properties as shown below.
const window = Ti.UI.createWindow();
const cardView = Ti.UI.Android.createCardView({
elevation: 0,
borderColor: 'gray',
borderWidth: 1,
layout: 'vertical',
padding: '16dp',
left: '10dp',
right: '10dp',
});
cardView.add(Ti.UI.createLabel({
text: 'This is a card view.\nThis is the 2nd line of text.',
textAlign: Ti.UI.TEXT_ALIGNMENT_LEFT,
touchEnabled: false,
width: Ti.UI.FILL
}));
window.add(cardView);
window.open();
!CardView-Outline-Light.png|thumbnail! !CardView-Outline-Dark.png|thumbnail!
*To-Do:*
We must replace the Java class used here...
https://github.com/appcelerator/titanium_mobile/blob/master/android/modules/ui/src/java/ti/modules/titanium/ui/android/CardViewProxy.java
*Breaking-Change:*
The app must use a "Theme.MaterialComponents" based theme or else an exception will occur. So, app's using a custom theme based from "Theme.AppCompat" or similar will crash. This is normal and the exception will state that the theme will need to change.
Attachments
File | Date | Size |
---|---|---|
CardView-Outline-Dark.png | 2021-02-23T02:21:19.000+0000 | 416826 |
CardView-Outline-Light.png | 2021-02-23T02:21:20.000+0000 | 417339 |
CardViewOutlineTest.js | 2021-02-23T02:20:40.000+0000 | 547 |
PR (master): https://github.com/appcelerator/titanium_mobile/pull/12353
FR Passed.
merged to master and 10_0_X for 10.0.0 release target.