修复GXView不同圆角的效果 (#469)

alibaba · Dec 20, 2023 · afee717 · afee717
1 parent 036b2ac
commit afee717
Show file tree

Hide file tree

Showing 3 changed files with 58 additions and 31 deletions.
diff --git a/GaiaXAndroid/src/main/kotlin/com/alibaba/gaiax/render/view/GXViewExt.kt b/GaiaXAndroid/src/main/kotlin/com/alibaba/gaiax/render/view/GXViewExt.kt
@@ -219,6 +219,7 @@ fun View.setBackgroundColorAndBackgroundImageWithRadius(style: GXStyle?) {
  }
  }
 
+ // 圆角实现
  if (background is GXColorGradientDrawable || background is GXLinearColorGradientDrawable) {
  (background as GradientDrawable).cornerRadii = style?.borderRadius?.value
  }

diff --git a/GaiaXAndroid/src/main/kotlin/com/alibaba/gaiax/render/view/basic/GXView.kt b/GaiaXAndroid/src/main/kotlin/com/alibaba/gaiax/render/view/basic/GXView.kt
@@ -19,6 +19,8 @@ package com.alibaba.gaiax.render.view.basic
 import android.content.Context
 import android.graphics.Canvas
 import android.graphics.Outline
+import android.graphics.Path
+import android.graphics.RectF
 import android.graphics.drawable.GradientDrawable
 import android.os.Build
 import android.util.AttributeSet
@@ -37,6 +39,7 @@ import com.alibaba.gaiax.render.view.blur.GXBlurHelper
 import com.alibaba.gaiax.render.view.drawable.GXRoundCornerBorderGradientDrawable
 import com.alibaba.gaiax.template.GXBackdropFilter
 
+
 /**
  * @suppress
  */
@@ -79,6 +82,7 @@ open class GXView : AbsoluteLayout, GXIViewBindData, GXIRootView, GXIRoundCorner
  val br = radius[6]
  if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
  if (tl == tr && tr == bl && bl == br && tl > 0) {
+ path = null
  this.clipToOutline = true
  this.outlineProvider = object : ViewOutlineProvider() {
  override fun getOutline(view: View, outline: Outline) {
@@ -91,11 +95,44 @@ open class GXView : AbsoluteLayout, GXIViewBindData, GXIRootView, GXIRoundCorner
  } else {
  this.clipToOutline = false
  this.outlineProvider = null
+
+ // 异圆角用path实现
+ if (path == null) {
+ path = Path()
+ } else {
+ path?.reset()
+ }
+ path?.addRoundRect(RectF(0f, 0f, this.layoutParams.width.toFloat(), this.layoutParams.height.toFloat()), radius, Path.Direction.CW)
  }
  }
  }
  }
 
+ var path: Path? = null
+
+ override fun onDraw(canvas: Canvas?) {
+ super.onDraw(canvas)
+ }
+
+ override fun dispatchDraw(canvas: Canvas) {
+ // 裁剪背景
+ path?.let { path ->
+ canvas.clipPath(path)
+ }
+
+ if (gxBackdropFilter != null) {
+ if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
+ gxBlurHelper?.let { gxBlurHelper ->
+ gxBlurHelper.callbackDispatchDraw(canvas) {
+ super.dispatchDraw(canvas)
+ }
+ }
+ }
+ } else {
+ super.dispatchDraw(canvas)
+ }
+ }
+
  override fun setRoundCornerBorder(borderColor: Int, borderWidth: Float, radius: FloatArray) {
  if (background == null) {
  val target = GXRoundCornerBorderGradientDrawable()
@@ -175,19 +212,6 @@ open class GXView : AbsoluteLayout, GXIViewBindData, GXIRootView, GXIRoundCorner
  }
  }
 
- override fun dispatchDraw(canvas: Canvas) {
- if (gxBackdropFilter != null) {
- if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
- gxBlurHelper?.let { gxBlurHelper ->
- gxBlurHelper.callbackDispatchDraw(canvas) {
- super.dispatchDraw(canvas)
- }
- }
- }
- } else {
- super.dispatchDraw(canvas)
- }
- }
 
  override fun release() {
  if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {

diff --git a/...droidDemo/app/src/main/kotlin/com/alibaba/gaiax/demo/fastpreview/GXFastPreviewActivity.kt b/...droidDemo/app/src/main/kotlin/com/alibaba/gaiax/demo/fastpreview/GXFastPreviewActivity.kt
@@ -131,26 +131,28 @@ class GXFastPreviewActivity : AppCompatActivity(), GXStudioClient.IFastPreviewLi
  // 创建视图
  gxView = GXTemplateEngine.instance.createView(gxTemplateItem, gxMeasureSize)
 
- // 绑定数据
- GXTemplateEngine.instance.bindData(gxView, gxTemplateData)
-
- // 将数据加入页面中
- fastPreviewRoot.addView(gxView, 0)
-
- // 获取模板信息
- val gxTemplateInfo = GXTemplateEngine.instance.getGXTemplateInfo(gxTemplateItem)
- if (gxTemplateInfo.isJsExist) {
-
- // 设置JS异常监听
- GXJSEngineProxy.instance.jsExceptionListener =
- object : GXJSEngine.IJsExceptionListener {
- override fun exception(data: JSONObject) {
- Log.d(TAG, "exception() called with: data = $data")
+ gxView?.let {
+ // 绑定数据
+ GXTemplateEngine.instance.bindData(gxView, gxTemplateData)
+
+ // 将数据加入页面中
+ fastPreviewRoot.addView(gxView, 0)
+
+ // 获取模板信息
+ val gxTemplateInfo = GXTemplateEngine.instance.getGXTemplateInfo(gxTemplateItem)
+ if (gxTemplateInfo.isJsExist) {
+
+ // 设置JS异常监听
+ GXJSEngineProxy.instance.jsExceptionListener =
+ object : GXJSEngine.IJsExceptionListener {
+ override fun exception(data: JSONObject) {
+ Log.d(TAG, "exception() called with: data = $data")
+ }
  }
- }
 
- // 注册容器
- GXJSEngineProxy.instance.registerComponentAndOnReady(gxView)
+ // 注册容器
+ GXJSEngineProxy.instance.registerComponentAndOnReady(gxView)
+ }
  }
  }
  }