docs: update README

This commit is contained in:
2025-02-19 10:40:49 +08:00
parent 829bf74606
commit 16b7602ab3
2 changed files with 123 additions and 8 deletions

View File

@@ -62,6 +62,20 @@ Android View 中的属性将配合 Gradle 插件实现自动生成,你可以
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:gravity="center" />
<com.google.android.material.button.MaterialButton
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click Me!"
android:textSize="16sp"
android:textColor="#FFFFFF"
android:backgroundTint="#FF0000"
android:layout_marginTop="16dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:gravity="center" />
</LinerLayout>
```
@@ -91,10 +105,10 @@ setContentView {
android.text = "Hello, World!"
android.textSize = 16.sp
android.textColor = Color.BLACK
android.marginTop = 16.dp
android.marginStart = 16.dp
android.marginEnd = 16.dp
android.marginBottom = 16.dp
android.layout_marginTop = 16.dp
android.layout_marginStart = 16.dp
android.layout_marginEnd = 16.dp
android.layout_marginBottom = 16.dp
android.gravity = Gravity.CENTER
// 或者使用字符串形式设置属性 (注意没有拼写检查)
namespace("android") {
@@ -120,6 +134,23 @@ setContentView {
}
}
)
// 使用第三方 View
View<MaterialButton>(
attrs = {
android.id = R.id.button
android.layout_width = WRAP_CONTENT
android.layout_height = WRAP_CONTENT
android.text = "Click Me!"
android.textSize = 16.sp
android.textColor = Color.WHITE
android.backgroundTint = Color.RED
android.layout_marginTop = 16.dp
android.layout_marginStart = 16.dp
android.layout_marginEnd = 16.dp
android.layout_marginBottom = 16.dp
android.gravity = Gravity.CENTER
}
)
}
}
// 你也可以直接构建根布局,但是需要有一个 UI Context
@@ -145,9 +176,35 @@ val root = Hikageable(
) {
// ...
}
}.toView() // 转换为标准 View
```
## 使用 Android Studio 预览
不同于 XMLHikage 不支持实时预览,但你可以继承于 Hikage 提供的 `HikagePreview` 在其中传入你的布局,然后在 Android Studio 右侧窗格中查看预览。
你还可以在代码中使用 `isInEditMode` 来避免在预览模式中展示无法显示的实际逻辑代码。
```kotlin
class MyPreview(context: Context, attrs: AttributeSet?) : HikagePreview(context, attrs) {
override fun onPreview(): HikageView {
// 返回你的布局
return Hikageable {
Button(
attrs = {
android.layout_width = WRAP_CONTENT
android.layout_height = WRAP_CONTENT
android.text = "Click Me!"
}
)
}
}
}
```
注意 `HikagePreview` 仅用于预览,不应该在实际代码中使用,否则会抛出异常。
Hikage 可能会有计划支持 Java但依然推荐使用 Kotlin。
## WIP

View File

@@ -66,6 +66,20 @@ modifications to their custom views.
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:gravity="center" />
<com.google.android.material.button.MaterialButton
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click Me!"
android:textSize="16sp"
android:textColor="#FFFFFF"
android:backgroundTint="#FF0000"
android:layout_marginTop="16dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:gravity="center" />
</LinerLayout>
```
@@ -95,10 +109,10 @@ setContentView {
android.text = "Hello, World!"
android.textSize = 16.sp
android.textColor = Color.BLACK
android.marginTop = 16.dp
android.marginStart = 16.dp
android.marginEnd = 16.dp
android.marginBottom = 16.dp
android.layout_marginTop = 16.dp
android.layout_marginStart = 16.dp
android.layout_marginEnd = 16.dp
android.layout_marginBottom = 16.dp
android.gravity = Gravity.CENTER
// Or use string form to set properties (note that there is no spelling check).
namespace("android") {
@@ -124,6 +138,23 @@ setContentView {
}
}
)
// Use third-party views.
View<MaterialButton>(
attrs = {
android.id = R.id.button
android.layout_width = WRAP_CONTENT
android.layout_height = WRAP_CONTENT
android.text = "Click Me!"
android.textSize = 16.sp
android.textColor = Color.WHITE
android.backgroundTint = Color.RED
android.layout_marginTop = 16.dp
android.layout_marginStart = 16.dp
android.layout_marginEnd = 16.dp
android.layout_marginBottom = 16.dp
android.gravity = Gravity.CENTER
}
)
}
}
// You can also build the root layout directly, but you need to have a UI Context.
@@ -150,9 +181,36 @@ val root = Hikageable(
) {
// ...
}
}.toView() // Convert to standard view.
```
## Preview with Android Studio
Unlike XML, Hikage does not support live previews, but you can inherit the `HikagePreview` provided by Hikage,
and pass in your layout, and then view the preview in the pane on the right of Android Studio.
You can also use `isInEditMode` in your code to avoid displaying actual logical code that cannot be displayed in preview mode.
```kotlin
class MyPreview(context: Context, attrs: AttributeSet?) : HikagePreview(context, attrs) {
override fun onPreview(): HikageView {
// Return to your layout.
return Hikageable {
Button(
attrs = {
android.layout_width = WRAP_CONTENT
android.layout_height = WRAP_CONTENT
android.text = "Click Me!"
}
)
}
}
}
```
Note `HikagePreview` is for preview only and should not be used in actual code, otherwise an exception will be thrown.
Hikage may have plans to support Java, but Kotlin is still recommended.
## WIP