skills.rest
SheTieJun
SheTieJunCOMMUNITY
Explore all skills by this author →
GitHub

shadow-layout

Configure QMUI shadow-enabled Android layouts with XML attributes.

8|1|Updated Jun 12, 2018
Search Tags:#layout#android#XML#shadow#UI-design#QMUI
One-click install
npx skills add https://github.com/SheTieJun/BaseKit --skill shadow-layout
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: shadow-layout
Source: https://github.com/SheTieJun/BaseKit/tree/main/.trae/skills/shadow-layout
Command: npx skills add https://github.com/SheTieJun/BaseKit --skill shadow-layout

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Android UI development often requires extensive XML boilerplate to achieve shadowed, bordered, and divider-enabled layouts. This Skill delivers ready-to-use QMUI layout components that simplify creating elevated, polished interfaces without extra drawables.

Core Features & Use Cases

  • Shadow-enabled layouts: QMUILinearLayout, QMUIFrameLayout, QMUIRelativeLayout, QMUIConstraintLayout support shadows and borders.
  • Border and divider customization: radius, border color/width, top/bottom/left/right dividers, and outline options.
  • Use Case: Designers or developers building Android apps who want ready-made, consistent shadowed components across screens, enabling faster UI prototyping and consistent design language.

Quick Start

Create a QMUILinearLayout in XML with attributes qmui_shadowColor, qmui_radius, qmui_shadowElevation, and optionally qmui_showBorderOnlyBeforeL to achieve a card-like component.

Frequently Asked Questions about shadow-layout

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add shadows and borders to Android XML layouts without extra drawables?▼

To add shadows and borders to Android XML layouts without drawables, use QMUI layout components like QMUILinearLayout. They support attributes such as qmui_shadowColor and qmui_radius to render elevated UI elements natively.

What is the best way to implement shadow elevation in Android UI design?▼

The best way to implement shadow elevation in Android UI design is using QMUI's ready-made layouts. You can configure qmui_shadowElevation and qmui_shadowColor directly in XML to achieve polished, card-like components.

Does QMUI support shadow and divider customization for ConstraintLayout?▼

Yes, QMUI supports shadow and divider customization for ConstraintLayout. QMUIConstraintLayout includes ready-to-use attributes for top, bottom, left, and right dividers, alongside shadow and border configurations.

How do I configure layout dividers using QMUI XML attributes?▼

You configure layout dividers using QMUI XML attributes by setting divider properties on shadow-enabled layouts. QMUILinearLayout and QMUIRelativeLayout allow you to specify border color, width, and directional dividers directly in your XML.

When do I need to use qmui_showBorderOnlyBeforeL in Android development?▼

You need to use qmui_showBorderOnlyBeforeL in Android development when you want borders to appear only on devices running versions older than Lollipop. This QMUI attribute ensures consistent visual shadow borders across different Android OS iterations.

Related Skills

Explore More Software Engineering Skills→
singhsume123singhsume123
15

xml-to-compose

Convert Android XML layout files to Jetpack Compose code.

Community
Intermediate
hschnehschne
1

tailwind

Style Rails ERB views and Svelte components with Tailwind CSS and DaisyUI utilities.

Community
Intermediate
truongnattruongnat

react-native-styling

Design React Native component styles with StyleSheet, Flexbox, and platform-aware overrides.

Community
Intermediate
telagodtelagod
238

claymorphism

Create claymorphism UI components with CSS tokens and dual inner shadows.

Community
Intermediate