<?xml version="1.0" encoding="utf-8"?>
<com.facebook.yoga.android.YogaLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:yoga="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
yoga:yg_flexDirection="column"
yoga:yg_justifyContent="space_between"
yoga:yg_alignItems="center"
<TextView
android:id="@+id/absolute"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
yoga:yg_positionType="absolute"
android:background="@android:color/darker_gray"
android:textColor="@android:color/white"
android:padding="5dp"
android:gravity="center"
yoga:yg_positionTop="10dp"
yoga:yg_positionLeft="10dp"
<TextView
android:id="@+id/top"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@android:color/darker_gray"
android:textColor="@android:color/white"
android:padding="5dp"
yoga:yg_marginTop="60dp"
<com.facebook.yoga.android.YogaLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
yoga:yg_flexDirection="row"
yoga:yg_justifyContent="flex_start"
yoga:yg_alignItems="center"
yoga:yg_alignSelf="center"
<TextView
android:id="@+id/middle_left"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:background="@android:color/darker_gray"
android:textColor="@android:color/white"
android:padding="5dp"
yoga:yg_alignSelf="center"
android:gravity="center"
<TextView
android:id="@+id/middle"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:background="@android:color/darker_gray"
android:textColor="@android:color/white"
android:padding="5dp"
yoga:yg_alignSelf="center"
android:gravity="center"
<TextView
android:id="@+id/middle_right"
android:layout_width="wrap_content"
android:layout_height="70dp"
android:background="@android:color/darker_gray"
android:textColor="@android:color/white"
android:padding="5dp"
yoga:yg_alignSelf="center"
android:gravity="center"
</com.facebook.yoga.android.YogaLayout>
<TextView
android:id="@+id/bottom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@android:color/darker_gray"
android:textColor="@android:color/white"
android:padding="5dp"
</com.facebook.yoga.android.YogaLayout>
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="yoga"><attr format="enum" name="yg_alignContent">
<enum name="auto" value="0"/>
<enum name="flex_start" value="1"/>
<enum name="center" value="2"/>
<enum name="flex_end" value="3"/>
<enum name="stretch" value="4"/>
<enum name="baseline" value="5"/>
</attr><attr format="enum" name="yg_alignItems">
<enum name="auto" value="0"/>
<enum name="flex_start" value="1"/>
<enum name="center" value="2"/>
<enum name="flex_end" value="3"/>
<enum name="stretch" value="4"/>
<enum name="baseline" value="5"/>
</attr><attr format="enum" name="yg_alignSelf">
<enum name="auto" value="0"/>
<enum name="flex_start" value="1"/>
<enum name="center" value="2"/>
<enum name="flex_end" value="3"/>
<enum name="stretch" value="4"/>
<enum name="baseline" value="5"/>
</attr>
<attr format="float" name="yg_aspectRatio"/>
<attr format="dimension" name="yg_borderLeft"/>
<attr format="dimension" name="yg_borderTop"/>
<attr format="dimension" name="yg_borderRight"/>
<attr format="dimension" name="yg_borderBottom"/>
<attr format="dimension" name="yg_borderStart"/>
<attr format="dimension" name="yg_borderEnd"/>
<attr format="dimension" name="yg_borderHorizontal"/>
<attr format="dimension" name="yg_borderVertical"/>
<attr format="dimension" name="yg_borderAll"/>
<attr format="enum" name="yg_direction">
<enum name="inherit" value="0"/>
<enum name="ltr" value="1"/>
<enum name="rtl" value="2"/>
</attr><attr format="enum" name="yg_display">
<enum name="flex" value="0"/>
<enum name="none" value="1"/>
</attr>
<attr format="float" name="yg_flex"/>
<attr format="float|string" name="yg_flexBasis"/>
<attr format="enum" name="yg_flexDirection">
<enum name="column" value="0"/>
<enum name="column_reverse" value="1"/>
<enum name="row" value="2"/>
<enum name="row_reverse" value="3"/>
</attr>
<attr format="float" name="yg_flexGrow"/>
<attr format="float" name="yg_flexShrink"/>
<attr format="dimension|string" name="yg_height"/>
<attr format="enum" name="yg_justifyContent">
<enum name="flex_start" value="0"/>
<enum name="center" value="1"/>
<enum name="flex_end" value="2"/>
<enum name="space_between" value="3"/>
<enum name="space_around" value="4"/>
</attr>
<attr format="dimension|string" name="yg_marginLeft"/>
<attr format="dimension|string" name="yg_marginTop"/>
<attr format="dimension|string" name="yg_marginRight"/>
<attr format="dimension|string" name="yg_marginBottom"/>
<attr format="dimension|string" name="yg_marginStart"/>
<attr format="dimension|string" name="yg_marginEnd"/>
<attr format="dimension|string" name="yg_marginHorizontal"/>
<attr format="dimension|string" name="yg_marginVertical"/>
<attr format="dimension|string" name="yg_marginAll"/>
<attr format="dimension|string" name="yg_maxHeight"/>
<attr format="dimension|string" name="yg_maxWidth"/>
<attr format="dimension|string" name="yg_minHeight"/>
<attr format="dimension|string" name="yg_minWidth"/>
<attr format="enum" name="yg_overflow">
<enum name="visible" value="0"/>
<enum name="hidden" value="1"/>
<enum name="scroll" value="2"/>
</attr>
<attr format="dimension|string" name="yg_paddingLeft"/>
<attr format="dimension|string" name="yg_paddingTop"/>
<attr format="dimension|string" name="yg_paddingRight"/>
<attr format="dimension|string" name="yg_paddingBottom"/>
<attr format="dimension|string" name="yg_paddingStart"/>
<attr format="dimension|string" name="yg_paddingEnd"/>
<attr format="dimension|string" name="yg_paddingHorizontal"/>
<attr format="dimension|string" name="yg_paddingVertical"/>
<attr format="dimension|string" name="yg_paddingAll"/>
<attr format="dimension|string" name="yg_positionLeft"/>
<attr format="dimension|string" name="yg_positionTop"/>
<attr format="dimension|string" name="yg_positionRight"/>
<attr format="dimension|string" name="yg_positionBottom"/>
<attr format="dimension|string" name="yg_positionStart"/>
<attr format="dimension|string" name="yg_positionEnd"/>
<attr format="dimension|string" name="yg_positionHorizontal"/>
<attr format="dimension|string" name="yg_positionVertical"/>
<attr format="dimension|string" name="yg_positionAll"/>
<attr format="enum" name="yg_positionType">
<enum name="relative" value="0"/>
<enum name="absolute" value="1"/>
</attr><attr format="dimension|string" name="yg_width"/><attr format="enum" name="yg_wrap">
<enum name="no_wrap" value="0"/>
<enum name="wrap" value="1"/>
</attr></declare-styleable>
</resources>
设置控件工场
SoLoader.init(this, false);
LayoutInflater.from(this).setFactory(YogaViewLayoutFactory.getInstance());
我们的demo在Application有两行的初始化操作,第一个是加载yoga的so库,第二步其实就是设置一个yoga的控件工场,里面的核心部分其实就是解析出yoga提供的YogaLayout和VirtualYogaLayout。
@Override
public View onCreateView(String name, Context context, AttributeSet attrs) {
if (YogaLayout.class.getSimpleName().equals(name)) {
return new YogaLayout(context, attrs);
if (VirtualYogaLayout.class.getSimpleName().equals(name)) {
return new VirtualYogaLayout(context, attrs);
return null;
setFactory也算是android对外提供的一个hook接口,让我们可以自定义对xml的一些操作,比如一些昼夜换肤方案,修改字体库等方案。
再来看看YogaLayout内部如何实现