Ashera provides cross platform widgets which can mixed and matched.
For example, TextView in android can be mapped to either UITextView or UILabel in ios. This is achieved using widget-override attribute in xml. In ts file, we can use ts-mixer to mix the widgets so that we can access functions on both widgets.
<TextView
style="@style/h2_bold_black"
widget-override-ios="ASUITextViewLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="10.23" />
The above example shows where a TextView in android is matched with ASUITextViewLabel rather than ASUILabel.
The mixing of the two widgets at ts level is shown below:
import "reflect-metadata";
import 'babel-polyfill';
import {Mixin} from 'ts-mixer';
import {ListView as ADListView} from '../android/widget/ListViewImpl';
import {ListView as SWTListView} from '../swt/widget/ListViewImpl';
class ListView extends Mixin(ADListView, SWTListView){
}
function applyMixins(derivedCtor: any, baseCtors: any[]) {
baseCtors.forEach(baseCtor => {
Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {
Object.defineProperty(derivedCtor.prototype, name, Object.getOwnPropertyDescriptor(baseCtor.prototype, name) as PropertyDescriptor);
});
});
}
applyMixins(ListView, [ADListView, SWTListView]);
export default ListView;
The above example mixes ListView from android and ListView from swt to produce cross platform neutral ListView where methods on ListView in swt and android is available.