weiV（發(fā)音同 wave）
https://github.com/hackware1993/weiV
wave.jpg
if ("weiV" == "View".reversed()) {
Log.d(
"weiV",
"它意味著控制反轉济瓢，你始終應該直接操作 UI 的描述 Widget 而不是直接操作 View荠割。"
)
}
它具有以下優(yōu)勢：
- 聲明式的 UI 寫法讓原生開發(fā)效率翻倍
- 達到或超越 View 系統(tǒng)的性能
- 我將我的 Flutter ConstraintLayout 移植到 Android，依托它先進的布局算法旺矾，在不引入固有特性測量的情況下蔑鹦，讓 View 樹中的子元素在任何情況都只會被
layout 一次，使得任意嵌套不會引起性能問題箕宙。即便 View 樹中的每個層級寬高都是 wrap_content 和 match_parent 混用 - xml 將被拋棄
- 我將我的 Flutter ConstraintLayout 移植到 Android，依托它先進的布局算法旺矾，在不引入固有特性測量的情況下蔑鹦，讓 View 樹中的子元素在任何情況都只會被
- 你所有的現(xiàn)有 View 系統(tǒng)的經(jīng)驗都將得到保留
- 所有的現(xiàn)有 UI 組件都將得以復用
- 它使用 Kotlin 編寫嚎朽，但友好的支持 Java
- 目前已經(jīng)開始初步支持實時生效的動態(tài)化。你可以下發(fā) JS柬帕，使用 JS 來寫頁面邏輯哟忍，并生成描述 Widget 樹的 JSON 傳遞給原生，原生使用非反射的方式將其轉為真正的 Widget
樹并渲染陷寝。后面可能會考慮在 JS 中實現(xiàn)聲明式 API
沒有人愿意推翻自己過去在 View 系統(tǒng)的經(jīng)驗锅很，Compose 的設計太過糟糕。
進展
目前完成了 DSL 的定義凤跑，可以解析成 Widget 樹了爆安，DSL 風格如下：
Kotlin 風格：
class WeiVCounterKotlinActivity : WeiVActivity() {
private var count = 0
private val maxCount = 10
private val minCount = 0
override fun build() = WeiV {
Flex {
it.orientation = FlexDirection.VERTICAL
Button(text = "Add count", enable = count < maxCount, onClick = {
setState {
count++
}
})
Button(text = "Sub count", enable = count > minCount, onClick = {
setState {
count--
}
})
Text(text = "count = $count")
}
}
}
Java 風格：
public class WeiVCounterJavaActivity extends BaseWeiVJavaActivity {
private int count = 0;
private int maxCount = 10;
private int minCount = 0;
@Override
public WeiV build() {
return WeiV(() -> {
Flex((it) -> {
it.wOrientation(FlexDirection.VERTICAL);
Button().wText("Add count").wEnable(count < maxCount).wOnClick(v -> {
setState(() -> {
count++;
});
});
Button().wText("Sub count").wEnable(count > minCount).wOnClick(v -> {
setState(() -> {
count--;
});
});
Text().wText("count = " + count);
});
});
}
}
effect.gif
weiV 是可擴展的。它會內置所有常用的 Widget仔引，這些 Widget 都是對系統(tǒng) View 的包裝扔仓。但對于第三方庫，就需要寫擴展咖耘，寫起來也極其簡單当辐，比如給 Button 的擴展如下：
class weiVButton @JvmOverloads constructor(
key: Key? = null,
layoutParam: LayoutParam<*>? = null,
var text: String = "",
var textSize: Float = TextConst.defaultTextSize,
var textColor: Int = TextConst.defaultTextColor,
var onClick: View.OnClickListener? = null,
var enable: Boolean = true
) :
LeafRenderWidget<Button, weiVButton>(key, layoutParam), IWeiVExtension,
ISerializableWidget<weiVButton> {
override fun createView(context: Context): Button = Button(context)
override fun doParameter(view: Button, first: Boolean): Button {
if (view.text != text) {
view.text = text
}
if (view.currentTextColor != textColor) {
view.setTextColor(textColor)
}
if (view.textSize != textSize) {
view.textSize = textSize
}
view.setOnClickListener(onClick)
if (view.isEnabled != enable) {
view.isEnabled = enable
}
return view
}
@JavaOnly
fun wText(text: String): weiVButton {
this.text = text
return this
}
@JavaOnly
fun wTextSize(textSize: Float): weiVButton {
this.textSize = textSize
return this
}
@JavaOnly
fun wTextColor(textColor: Int): weiVButton {
this.textColor = textColor
return this
}
@JavaOnly
fun wOnClick(onClick: View.OnClickListener?): weiVButton {
this.onClick = onClick
return this
}
@JavaOnly
fun wEnable(enable: Boolean): weiVButton {
this.enable = enable
return this
}
override fun fromJson(jsonObj: JSONObject, param: Map<String, Any?>): weiVButton {
text = (param["text"] as String?) ?: ""
textSize = ((param["textSize"] as Double?) ?: TextConst.defaultTextSize).toFloat()
val colorStr = param["textColor"] as String?
textColor = if (colorStr != null && colorStr.startsWith("#")) {
Color.parseColor(colorStr)
} else {
TextConst.defaultTextColor
}
return this
}
override fun toString(): String {
return "weiVButton(text='$text', textSize=$textSize, textColor=$textColor, enable=$enable)"
}
}
@KotlinOnly
fun WeiV.Button(
key: Key? = null,
layoutParam: LayoutParam<*>? = null,
text: String = "",
textSize: Float = TextConst.defaultTextSize,
textColor: Int = TextConst.defaultTextColor,
onClick: View.OnClickListener? = null,
enable: Boolean = true
): weiVButton {
return addLeafRenderWidget(
weiVButton(
key = key,
layoutParam = layoutParam,
text = text,
textSize = textSize,
textColor = textColor,
onClick = onClick,
enable = enable
)
)
}
weiV 基于 View 系統(tǒng)，因此它可以嵌入到 View 樹的任何地方鲤看。你可以在 weiV 中嵌入 Compose、Flutter耍群，也可以在 Compose义桂、Flutter 里嵌入 weiV。推薦在 Compose 頂層嵌入 weiV 以改善 Compose 的性能蹈垢。??
預計很快 weiV 就可以真正跑起來了慷吊。但還任重而道遠。首先需要移植 Flutter ConstraintLayout曹抬，其次大概率會重寫一個 weiV 版本的 RecyclerView溉瓶，以支持像 Flutter 那樣簡單的列表用法，不需要寫 Adapter。
訂閱我的微信公眾號（FlutterFirst）以及時獲取 weiV 的最新動態(tài)堰酿。后續(xù)也會分享一些高質量的疾宏、獨特的、有思想的 Flutter 和 Android 技術文章触创。
https://github.com/hackware1993/weiV
支持我
如果它對你幫助很大坎藐，可以考慮贊助我一杯奶茶，或者給個 star哼绑。你的支持是我繼續(xù)維護的動力岩馍。
聯(lián)系方式
協(xié)議
MIT License
Copyright (c) 2022 hackware1993
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and
associated documentation files (the "Software"), to deal in the Software without restriction,
including without limitation the rights to use, copy, modify, merge, publish, distribute,
sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial
portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT
NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES
OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
