跳到主要内容

游戏模板

Flitwing One-Tap Flying Game App

An Expo / React Native one-tap flyer: flap a round bird through the gaps between wooden posts over a morning meadow, take golden seeds, win medals, buy birds, finish missions and climb a weekly board. Plays on sample data.

  • 10 个界面
  • iOS 和 Android
  • 示例数据
  • 更新于 2026年10月29日
  • 已验证版本
  • 已复刻 1 次

免费复制 · 完整源码 · 无需信用卡

界面

来自实际运行应用的 6 个界面。

包含内容

  1. Playable in the first second: the game is the home screen and the first tap flaps and starts the round
  2. A pure, tested engine in bird heights: a seeded course, a sawtooth ramp from a forgiving start, a fairness autopilot
  3. Every picture drawn in code with react-native-svg: a morning meadow in three parallax layers, walnut posts, eight birds
  4. Game feel: wing poses and tilt, hit-stop, shake, a white flash, feathers and score pops, calm under reduce motion
  5. Three missions from real runs, a 7-day daily reward as posts rising from the meadow, and eight birds bought with coins
  6. Leaderboard: a podium of rival birds, your ten best runs, and a weekly Supabase board that refuses impossible scores

关于此模板

Overview

Flitwing is a one-tap flying game built on Expo SDK 57 and React Native with the FluxNative kernel. The first screen is the game: a bright morning sky over a meadow, the bird bobbing beside its wordmark, your best and its medal, and a pulsing Tap to fly. Each tap sets the bird's upward speed; posts slide in with a gap to fly through, every post passed is a point and a golden seed is three. A crash freezes for a beat, shakes the world and drops the bird, then one panel shows the score, the best, the medal and the coins, with Play again starting the next round at once.

With .env blank the game runs in sample mode: a player two weeks in with a best of 47 (silver), 1,240 coins, three birds, ten recent runs, missions half done and day 4 of the daily reward waiting. Everything the player does is kept on the device. Setting the Supabase values turns on the weekly board; setting the RevenueCat keys sells Plus.

Key features

  • The game: ready, flying, paused and over on one full-bleed screen, with the score top left over the best, the coin pill and a round pause button top right, and a raised dock of drawn icons to Shop, Missions, Scores and Settings

  • Rules in a pure engine (engine.ts), unit-tested: a tap sets the upward speed, the first post arrives 2.4 s after the first tap, the gap narrows every 10 posts with three easy posts after each step

  • Shop: eight birds that differ by build, face, tail, beak and one prop (a tuft, goggles, a scarf, a leaf cap, a bobble hat, a flame crest, a star trail), each on a twig on a tile in its colour, locked ones as silhouettes behind a padlock, the one on show big on a branch

  • Missions: three at a time from real runs (pass 20 posts in one run, take 8 golden seeds, fly for 3 minutes…), a coin reward each, harder each time round the ladder

  • Daily reward: a 7-day ladder by the phone's date, drawn as posts rising from the meadow with the bird perched on today's

  • Leaderboard: a podium of the week's three best birds on posts, the flock of rival birds to beat, your ten best runs and a chart of the last ten; with Supabase a weekly board of every player

  • How to play: three steps drawn with the game's own sprites, and the four medals

  • Settings: sound effects, vibration, reduce motion, How to play, Plus, About, Terms of use, Privacy policy and Delete my data

Screens

10 screens: the game (ready, flying, paused, over), Shop, Missions, Leaderboard, How to play, Flitwing Plus, Settings, About, Terms of use and Privacy policy. One stack with no tab bar. Every pushed screen lives in the game's world: its sky is the page and the meadow runs along its foot, titles are drawn in the wordmark's outlined type, and each screen is staged its own way (a bird on a branch in the shop, a podium of posts on the leaderboard, a flock on Plus). Only what you tap is raised: chunky buttons with a lip that sinks, over flat framed boards and wooden plaques. The day look holds in light and dark, as most casual games do.

Game and backend

  • One requestAnimationFrame loop while flying, a pure step(game, dt) with dt clamped to 0.05 s, seeded randomness, taps through PanResponder at touch-down (touch, mouse and the preview's taps)

  • The game folder reads app data through one hook (useGameProgress), so it lifts into another app

  • Weekly board on Supabase: nobody reads the tables (row-level security, a player sees only their own runs); the board comes from one function with names, bests, places and the sample rivals marked, never an id; anonymous sign-in, names made on the server from the player's id

  • The server times every run: start_run at the first tap, then submit_score takes each run once and refuses a score the run's time cannot hold or a run longer than the time since it started; the rule is held to the engine by tests

  • A run that ends offline is kept and sent later, and the board says when the last run did not go up; eight sample rivals, marked as samples, fill the first week

  • Delete my data clears the device and takes the player's runs off the board, waiting for the network when it must; Plus stays with the store account

Monetisation

Flitwing Plus is one non-consumable in-app purchase sold through the App Store and Google Play with RevenueCat (react-native-purchases): every bird, including Midnight that only Plus has, and double coins on every run. Access comes from the plus entitlement only, with Restore purchase on the Plus screen. Without RevenueCat keys the Plus screen shows the intended price marked as a sample, says purchases open in the App Store version, and never grants access. No ads, no loot boxes, nothing that pays out.

Setup

  • Connect Supabase, apply the migration and allow anonymous sign-ins for the weekly board

  • Connect RevenueCat with a flitwing_plus product and a plus entitlement to sell Plus

  • Rename the game, then reskin the sky, the posts and the birds in palette.ts and art.tsx

  • Set NEW_DEVICE_SAVE to empty and replace the sample Terms of use and Privacy policy before you ship

gameflying gameone tap gamearcadecasual gameleaderboardmissionssupabaserevenuecatreact nativeexpoios

你将获得

  • 完整源码 — 使用 TypeScript 的 Expo 和 React Native,作为你工作区中的一个应用。
  • 实时预览 — 在浏览器或手机上试用每项更改。
  • 已验证版本 — 可编译,每个界面都能无错误打开。
  • AI 助手 — 用聊天修改任何内容;每次修改会消耗积分。
  • 构建与上架 — iOS 和 Android 构建,从发布页发送到 App Store 和 Google Play。
  • 复制不耗积分 — 复制本身不收费。

使用较早版本的 FluxNative 制作。你的副本可以照常使用;需要应用语言、货币和关于链接时,请让智能体更新。

你需要什么

  • FluxNative 账号 — 免费套餐最多可有 2 个应用。
  • 无需先接后端 — 在你连接自己的后端之前,它使用示例数据运行。
  • Creator 或更高套餐 — 用于原生构建和上架。
  • 商店账号 — Apple Developer Program(每年 99 美元)和 Google Play(一次性 25 美元),用于发布。

源码里有什么

个界面
10
个文件(副本中)
323
行为此应用编写的代码
6,391
个现成 UI 组件
139

应用文本语言:英语和越南语

技术栈

Expo SDK
57.0.22
React Native
0.86.3
React
19.2.8
TypeScript
6.0.3
Expo Router
57.0.21
Supabase JS
2.112.3
RevenueCat
10.9.1

来自此版本的 package.json。

设计系统

标题
Outfit
正文
系统字体
  • 仅浅色模式
  • Liquid Glass
  • 胶囊按钮
  • 悬浮卡片

复刻后的设置

你的副本会和构建它的 AI 助手一起打开。按顺序完成步骤:某一步需要连接的内容,请在 Server 中连接,然后发送每条提示词。

  1. Connect Supabase for the weekly board

    Server › Backend › Supabase. Apply supabase/migrations/20261027120000_weekly_board.sql, allow anonymous sign-ins in the Supabase dashboard, and write the project URL and anon key to .env. The leaderboard then opens on This week.

    给 AI 的提示词

    Connect this game to my Supabase project from Server › Backend › Supabase. Write EXPO_PUBLIC_SUPABASE_URL and EXPO_PUBLIC_SUPABASE_ANON_KEY to .env and apply supabase/migrations/20261027120000_weekly_board.sql. Remind me to turn on Authentication › Sign In / Providers › Allow anonymous sign-ins in the Supabase dashboard, because each device signs in anonymously when its first run starts. Then check that the Leaderboard opens on This week with the eight sample rivals marked as samples, and that a finished run appears there under the device's board name. Before launch, delete the sample rivals (delete from public.scores where sample).

  2. Sell Flitwing Plus

    Server › Monetization: a non-consumable flitwing_plus in App Store Connect and Google Play, the RevenueCat entitlement plus and the offering default with a Lifetime package, then the public SDK keys in .env.

    给 AI 的提示词

    Set up Flitwing Plus through RevenueCat from Server › Monetization. Create a non-consumable in-app purchase with the product ID flitwing_plus in App Store Connect and a one-time product flitwing_plus in Google Play, an entitlement named plus that holds them, and the current offering default with a Lifetime package of it. Write EXPO_PUBLIC_REVENUECAT_IOS_KEY and EXPO_PUBLIC_REVENUECAT_ANDROID_KEY to .env, and set PLAN_PREVIEW in src/services/iap/index.ts to the price I choose. Tell me how to test a sandbox purchase and Restore purchase on a device build.

  3. Rename and reskin the game

    The wordmark draws GAME_TITLE in src/features/game/GameScreen.tsx; the sky, posts, seeds and birds are named once in palette.ts and drawn in art.tsx; the birds' names and coin prices are SKINS in src/services/progress.

    给 AI 的提示词

    Reskin Flitwing as my game. Ask me for the game's name and its hero (a bird, a helicopter, a fish…). Set GAME_TITLE in src/features/game/GameScreen.tsx and the app name in app.json, change the scene's colours in src/features/game/palette.ts, redraw the hero in BirdBody in src/features/game/art.tsx, and rename the eight looks in SKINS (src/services/progress/index.ts) keeping their ids. Show me the ready screen, a round and the shop in light and dark after the change.

  4. Get ready to ship

    Set NEW_DEVICE_SAVE to "empty" in src/services/progress/index.ts so new players start at zero, and use your own Terms of use and Privacy policy (in-app pages or their URLs in .env).

    给 AI 的提示词

    Prepare Flitwing for release. Set NEW_DEVICE_SAVE to "empty" in src/services/progress/index.ts. Ask me for my studio's name and contact email, then rewrite src/features/legal/TermsScreen.tsx and src/features/legal/PrivacyScreen.tsx for my studio, keeping what the game really does: progress on the device, the weekly board's anonymous sign-in id and runs, purchases through the stores and RevenueCat, and the IP address those servers see. Change the bundle ID and package name in app.json to mine.

如何使用此模板

  1. 使用模板,在你的工作区中获得一个可编辑的副本及其源代码(模板)。
  2. 用平常的话告诉 AI 助手你想要的修改(与助手协作)。
  3. 在实时预览或手机上试用每次修改(预览)。
  4. 使用 Creator 或更高套餐,构建 iOS 和 Android 应用并提交到应用商店(发布概览)。

许可与支持

许可

为你生成的应用归你所有;模板代码仍归 InspireUI 所有,并授权你在自己的应用中使用(条款 › 我们的知识产权)。

帮助

  • 指南:模板、助手和发布。
  • 在帮助中联系支持;通常 1–2 个工作日内回复。
  • 在你的副本中,可向 AI 助手询问任何界面或文件。

由 FluxNative 制作

支持政策

常见问题

免费吗?

复制免费模板不收费,也不耗积分;Premium 模板按网站一次性购买。聊天修改和构建会消耗积分。

我拥有什么?

为你生成的应用归你所有。模板代码仍归 InspireUI 所有,并授权你在自己的应用中使用(条款 › 我们的知识产权)。

需要懂代码吗?

不需要。用日常语言让助手修改;需要时随时可看完整源码。

自带后端吗?

不带。完整应用会写明所需后端,你在 Server 中连接自己的;设计模板使用示例数据运行。

可以改设计吗?

可以。设计标签页可设置品牌色、颜色、字体和圆角,不耗积分;其余由助手修改。

发布需要哪个套餐?

Creator 或更高套餐,用你自己的 Apple 和 Google 账号构建并上传到商店。Premium 模板的应用在连接其网站后,任何套餐都能构建。

能下载源码吗?

可以,使用“下载源码”或“推送到 GitHub”,前提是你的工作区已购买套餐、积分或付费模板。Premium 模板的应用还需连接其网站。

如果是用较早版本的 FluxNative 做的呢?

你的副本照常可用。让助手把它更新到较新的功能,如应用语言和货币;这是最后一个设置步骤。

准备好打造你的应用了吗?

从 Flitwing One-Tap Flying Game App 开始,通过聊天修改任何内容。你的副本包含完整源代码。

免费复刻,无需信用卡。

Taking a little longer than usual…

Loading FluxNative