Inline Gradient Chips in HarmonyOS: CustomSpan, Text Wrapper, and ImageSpan Approaches

Read the original article：Inline Gradient Chips in HarmonyOS: CustomSpan, Text Wrapper, and ImageSpan Approaches Inline Gradient Chips in HarmonyOS: CustomSpan, Text Wrapper, and ImageSpan Approaches Requirement Description Render inline text where a specific “span” segment has a gradient background. Direct linearGradient on Span doesn’t work, so we provide three working approaches. Background Knowledge Span: child of Text/ContainerSpan; does not support universal attributes, so linearGradient is ignored. Use Text for universal styling or custom-draw with CustomSpan. Docs: Span, Text, ContainerSpan Universal gradient attribute: linearGradient works on components that support universal attributes (e.g., Text). Docs: linearGradient Styled strings & CustomSpan: draw your own background/text for inline segments. Docs: CustomSpan (Styled String), Example – Span Graphics API for gradients: set a shader on the brush. Docs (search please): Brush.setShaderEffect, ShaderEffect.createLinearGr