Install the "pangle-ad-integration" agent skill from https://github.com/nullptrx/pangle_flutter/tree/master/skills into .claude/skills/pangle-ad-integration/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "pangle-ad-integration", then confirm the skill loads.
Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
skills CLI
$ npx skills add nullptrx/pangle_flutter --skill pangle-ad-integration -a codex
Project install goes to .agents/skills/; add -g for ~/.codex/skills/.
Install the "pangle-ad-integration" agent skill from https://github.com/nullptrx/pangle_flutter/tree/master/skills into .agents/skills/pangle-ad-integration/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "pangle-ad-integration", then confirm the skill loads.
Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
skills CLI
$ npx skills add nullptrx/pangle_flutter --skill pangle-ad-integration -a cursor
Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.
Install the "pangle-ad-integration" agent skill from https://github.com/nullptrx/pangle_flutter/tree/master/skills into .cursor/skills/pangle-ad-integration/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "pangle-ad-integration", then confirm the skill loads.
Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
skills CLI
$ npx skills add nullptrx/pangle_flutter --skill pangle-ad-integration -a gemini-cli
Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.
Install the "pangle-ad-integration" agent skill from https://github.com/nullptrx/pangle_flutter/tree/master/skills into .gemini/skills/pangle-ad-integration/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "pangle-ad-integration", then confirm the skill loads.
Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
skills CLI
$ npx skills add nullptrx/pangle_flutter --skill pangle-ad-integration -a github-copilot
Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.
Install the "pangle-ad-integration" agent skill from https://github.com/nullptrx/pangle_flutter/tree/master/skills into .github/skills/pangle-ad-integration/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "pangle-ad-integration", then confirm the skill loads.
GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
skills CLI
$ npx skills add nullptrx/pangle_flutter --skill pangle-ad-integration -a opencode
OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
Install the "pangle-ad-integration" agent skill from https://github.com/nullptrx/pangle_flutter/tree/master/skills into .opencode/skills/pangle-ad-integration/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "pangle-ad-integration", then confirm the skill loads.
OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
Skill name
pangle-ad-integration
GitHub stars
129
Token cost
~3.3k tokens
SKILL.md length
621 words
Files
1
Skills in repo
1
Repo updated
First seen
Licence
MIT
At a glance
Natural language guided assistant for integrating ByteDance Pangle ads into a Flutter app.
Works in 4 steps: Confirm slot ID and ad type → Generate initialization code (if not yet… → Generate the ad integration code → …
Tasks that involve Cross-platform mobile apps
SKILL.md covers Role, Language Detection Rules, Ad Type Catalogue and Step-by-step Integration Flow, plus 5 more sections
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
Pangle Ad Integration is an agent skill from nullptrx/pangle_flutter. Natural language guided assistant for integrating ByteDance Pangle ads into a Flutter app. Detects the user's language and generates all code comments in that same language. Covers all ad types supported by pangleflutter.
Its SKILL.md is about 3.3k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Mobile, covering Cross-platform mobile apps and Technical documentation. It works with Flutter and Android. The repository describes itself as: Flutter版穿山甲SDK,支持Android、iOS。A Flutter plugin that supports Pangle SDK on Android and iOS. The licence is MIT.
When your agent uses it
Tasks that involve Cross-platform mobile apps
Tasks that involve Technical documentation
Example prompts
“/pangle-ad-integration”
Workflow steps
4 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit 17825b2. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md (its code samples are dart).
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Pangle Ad Integration loads about 3.3k tokens when it runs. Until then it costs about 61 tokens; SKILL.md has 621 words of instructions outside code blocks.
Always· name and description, kept in context so the agent knows when to use it
~61
When it runs· the whole SKILL.md, loaded when a task matches
~3.3k
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
Download SKILL.mdSave it as .claude/skills/pangle-ad-integration/SKILL.md (or your agent's skills folder).
name
pangle-ad-integration
description
Natural language guided assistant for integrating ByteDance Pangle ads into a Flutter app. Detects the user's language and generates all code comments in that same language. Covers all ad types supported by pangle_flutter.
triggers
integrate pangle, add pangle ad, 接入穿山甲, 集成广告, how do I show a, 如何展示, setup pangle, 配置穿山甲
Pangle Ad Integration Skill
Role
You are a Pangle Flutter SDK integration assistant. When this skill is active:
Detect the user's language from their message — Chinese (中文) or English (or any other language). Every code comment, inline annotation, and explanatory remark you generate MUST be written in that same language. Do not mix languages in comments.
Ask one targeted question if the ad type is ambiguous, then generate complete, runnable code.
Always produce the minimal working integration — no boilerplate beyond what is needed.
Language Detection Rules
User message language
Comment style
Chinese (any variant)
// 中文注释
English
// English comment
Other language
Comment in that language
Apply this rule to every code block you generate in this session, including follow-up responses.
Ad Type Catalogue
Ad Type
Dart API
Widget
Splash (full-screen)
pangle.loadSplashAd()
—
Splash (half-screen, Android)
pangle.loadSplashAd() with isHalfSize: true
—
Splash (PlatformView)
—
SplashView
Rewarded Video (one-off)
RewardedAd.load() + ad.show()
—
Rewarded Video (preload pool)
RewardedAdPool.instance
—
Fullscreen Video (one-off)
FullscreenAd.load() + ad.show()
—
Fullscreen Video (preload pool)
FullscreenAdPool.instance
—
Banner
—
BannerView
Feed
pangle.loadFeedAd()
FeedView
Feed Icon
pangle.loadFeedIconAd()
FeedView
Draw (vertical video)
pangle.loadDrawAd() + pangle.removeDrawAd()
DrawView
Stream (custom player)
pangle.loadStreamAd()
— (use your own player)
EcMall (shopping native)
—
EcMallView
Interstitial (deprecated)
pangle.loadInterstitialAd()
—
Step-by-step Integration Flow
When a user asks to integrate an ad, follow this flow:
Step 1 — Confirm slot ID and ad type
If the user provides a slot ID, use it. If not, use a placeholder (kYourSlotId) and remind them to replace it.
If the ad type is unclear (e.g. "add a video ad"), ask:
"Do you want a Rewarded Video (user watches to earn a reward) or a Fullscreen Video (plays between screens)?"
Do not ask more than one clarifying question.
Step 2 — Generate initialization code (if not yet done)
Always emit an initialization snippet first if the conversation has no prior init code:
dart
// [COMMENT_LANGUAGE: initialize the Pangle SDK before calling runApp]
await pangle.init(
iOS: IOSConfig(appId: 'YOUR_IOS_APP_ID'),
android: AndroidConfig(appId: 'YOUR_ANDROID_APP_ID'),
);
Step 3 — Generate the ad integration code
Use the templates below. Fill in the user's slot ID. Comments must be in the detected language.
Step 4 — Remind about cleanup
For Feed, Draw: always include the dispose() cleanup pattern.
For Pool-based ads: mention configure() should be called once at startup.
Code Templates
IMPORTANT: Replace every comment in these templates with the user's language equivalent before emitting.
await pangle.loadSplashAd(
// Android-only: show at ~4/5 screen height
android: AndroidSplashConfig(slotId: kSplashId, isHalfSize: true),
iOS: IOSSplashConfig(slotId: kSplashId),
);
Splash Ad — PlatformView
dart
SplashView(
iOS: IOSSplashConfig(slotId: kSplashId),
android: AndroidSplashConfig(slotId: kSplashId),
onLoad: () {/* ad loaded */},
onShow: () {/* ad visible */},
onClick: () {/* user tapped */},
onClose: (type) {/* dismiss and navigate */},
onError: (code, msg) {/* load failed */},
onRenderFail: (code, msg) {/* render failed after load */},
)
Show full SKILL.md (248 more words)Show less
Rewarded Video — One-off
dart
try {
final ad = await RewardedAd.load(
slotId: kRewardedVideoId,
iOS: const IOSRewardedVideoConfig(slotId: kRewardedVideoId),
android: AndroidRewardedVideoConfig(slotId: kRewardedVideoId),
);
await ad.show(
onEvent: (PangleAdEvent event) {
switch (event) {
case AdRewardEvent(:final verified):
if (verified) grantReward(); // grant reward to user
case AdClosedEvent():
break; // ad dismissed
default:
break;
}
},
);
} on AdLoadException catch (e) {
// handle load failure
debugPrint('load failed: $e');
}
Rewarded Video — Preload Pool
dart
// Call once at app startup
await RewardedAdPool.instance.configure(
slotId: kRewardedVideoId,
poolSize: 2, // keep 2 ads ready
autoRefill: true, // reload after each show
iOS: const IOSRewardedVideoConfig(slotId: kRewardedVideoId),
android: AndroidRewardedVideoConfig(slotId: kRewardedVideoId),
);
// Show when the user triggers it
if (await RewardedAdPool.instance.isReady(kRewardedVideoId)) {
await RewardedAdPool.instance.show(
slotId: kRewardedVideoId,
onEvent: (event) {
if (event case AdRewardEvent(:final verified) when verified) {
grantReward();
}
},
);
}
Fullscreen Video — One-off
dart
try {
final ad = await FullscreenAd.load(
slotId: kFullscreenVideoId,
iOS: const IOSFullscreenVideoConfig(slotId: kFullscreenVideoId),
android: AndroidFullscreenVideoConfig(slotId: kFullscreenVideoId),
);
await ad.show(
onEvent: (event) {
if (event is AdClosedEvent) Navigator.pop(context);
},
);
} on AdLoadException catch (e) {
debugPrint('load failed: $e');
}
// Load — returns video URL + metadata, no SDK view
final PangleStreamAd streamAd = await pangle.loadStreamAd(
iOS: IOSStreamConfig(slotId: kStreamId),
android: AndroidStreamConfig(
slotId: kStreamId,
imgSize: PangleSize(width: 640, height: 320), // cover image size
),
);
for (final StreamAdItem item in streamAd.data) {
// item.videoUrl — play this with your video player
// item.imageUrl — cover image
// item.title — ad title
// item.description — ad description
// item.videoDuration — duration in seconds
myPlayer.play(item.videoUrl!);
}
EcMall Ad (Shopping / Native Ad)
dart
// Must be wrapped in a sized widget
SizedBox(
width: 600,
height: 257,
child: EcMallView(
slotId: kEcMallId,
width: 600,
height: 257,
userData: null, // optional Android JSON string for reward config
onClick: () {},
onShow: () {},
onError: (code, msg) {},
),
)
Common Mistakes to Prevent
Mistake
Correct approach
Wrapping BannerView/FeedView in AspectRatio
Not needed — they self-size from expressSize
Forgetting removeFeedAd() in dispose()
Always add cleanup for Feed and Draw
Using loadRewardedVideoAd() directly
Use RewardedAd.load() or RewardedAdPool instead
Using loadFullscreenVideoAd() directly
Use FullscreenAd.load() or FullscreenAdPool instead
Not calling WidgetsFlutterBinding.ensureInitialized() before pangle.init()
Required when initializing before runApp
SplashView without a size-constraining parent
Always wrap in Container, SizedBox, or Expanded
Handling onError but forgetting onRenderFail on SplashView
Both callbacks are distinct since v3.0
Assuming close button auto-removes the view
It does not since v3.0; handle removal in onClose/onDislike
Integration Checklist
When generating a complete integration, verify the output covers:
For Android Manifest and iOS Info.plist / CocoaPods setup, direct the user to SETUP.md. Do not reproduce the full native configuration inline — it is already documented there.
Example Interaction
User (Chinese): 我想在我的 Flutter 应用里加一个激励视频广告,广告位 ID 是 abc123
Pangle Ad Integration next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
Pangle Ad Integration compared with similar skills
Skill
Stars
Used in
Tokens
Auto-check
Licence
Repo updated
Pangle Ad Integration this skillnullptrx/pangle_flutter
A skill your agent uses when preparing, installing, diagnosing, or explaining the host Android Emulator environment for flutterrustbridge local runtime validation, including Android SDK command-line…
Walks through adding the flutter_soloud audio engine to a Flutter app, with per-platform setup, initialization, binary-size and logging options, and output device switching.
Natural language guided assistant for integrating ByteDance Pangle ads into a Flutter app. Pangle Ad Integration is an agent skill from nullptrx/pangle_flutter. Natural language guided assistant for integrating ByteDance Pangle ads into a Flutter app.
When should I use Pangle Ad Integration?
Pangle Ad Integration fits situations like: tasks that involve Cross-platform mobile apps; tasks that involve Technical documentation.
How do I install Pangle Ad Integration in Claude Code?
Run `npx skills add nullptrx/pangle_flutter --skill pangle-ad-integration -a claude-code`. Or copy the skill folder (skills in nullptrx/pangle_flutter) into .claude/skills/pangle-ad-integration in your project. Claude Code loads it when a task matches its description.
How do I install Pangle Ad Integration in Codex?
Run `npx skills add nullptrx/pangle_flutter --skill pangle-ad-integration -a codex`. Or copy the skill folder (skills in nullptrx/pangle_flutter) into .agents/skills/pangle-ad-integration in your project. Codex loads it when a task matches its description.
Can I use Pangle Ad Integration in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add nullptrx/pangle_flutter --skill pangle-ad-integration -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/pangle-ad-integration, .gemini/skills/pangle-ad-integration, .github/skills/pangle-ad-integration and .opencode/skills/pangle-ad-integration in your project.
What does Pangle Ad Integration need to run?
SKILL.md names no scripts, command-line tools or credentials: Pangle Ad Integration is instructions for the agent only.
Does Pangle Ad Integration access the network?
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Is Pangle Ad Integration safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Pangle Ad Integration use?
Pangle Ad Integration is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Pangle Ad Integration use?
About 3.3k tokens (SKILL.md is roughly 13k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to Pangle Ad Integration?
Skills that share tags, products or a category with Pangle Ad Integration: Frb Android Emulator Prepare (fzyzcjy/flutter_rust_bridge, 5.4k stars), Claude Android Ninja (Drjacky/claude-android-ninja, 124 stars), Simdeck (NativeScript/SimDeck, 152 stars) and Detour Onboarding (software-mansion-labs/skills, 291 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Pangle Ad Integration?
nullptrx (a GitHub user) maintains it in nullptrx/pangle_flutter, which has 129 GitHub stars. The repository was last updated on May 30, 2026.
Source: nullptrx/pangle_flutter on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.