ページ内ナビ
概要
BalloonはComposeとKotlin Multiplatform向けのツールチップ/ポップアップライブラリです。矢印、padding、角丸、色、animationなどをBalloonStyleへまとめ、BalloonStateから表示位置や開閉を制御できます。
特徴と向いている用途
公式資料に基づく紹介・実機未検証 · 内容確認日:
主な特徴
見た目をBalloonStyle、表示状態をBalloonStateへ分ける
rememberBalloonBuilderで矢印・余白・角丸・背景色・animationを定義し、rememberBalloonStateで表示状態を保持します。styleを更新しながら表示中のBalloonを再構成できます。
出典:[2]
Balloon composableまたはModifierからanchorへ結び付ける
Balloonでanchorを包む方法と、BalloonHost配下でModifier.balloonを使う方法を選べます。Tooltip本文はCompose slotなのでText・Icon・Rowなどを自由に構成できます。
出典:[2]
向いている用途
オンボーディングやcontext helpをCompose UIへ加えたい場合に向く
ボタンや画像などのanchorに対して補足を表示し、位置・animation・overlayをアプリのdesignへ合わせたいAndroid/KMPアプリに適します。
出典:[2]
導入前の確認
参考にした公式資料
- [1]skydoves/Balloon — GitHub repository(2026-10-06)
- [2]Balloon 2.0.1 — Getting Started(2026-10-06)
- [3]Balloon 2.0.1 release(2026-10-06)
- [4]Balloon Apache-2.0 license(2026-10-06)
編集部からの補足
オンボーディングや補足説明をCompose UIへ組み込みたい場合に扱いやすいライブラリです。2.0系ではCompose Multiplatform中心へ再設計されているため、1.xから更新する場合はstyle/state APIとminimum SDKを確認してください。
3ステップで試す
- 1
Balloon 2.0.1を追加する
AndroidまたはCompose Multiplatformプロジェクトへ2.0.1を固定して追加します。AndroidはAPI 23以上が必要です。
implementation("com.github.skydoves:balloon:2.0.1") - 2
tooltipのstyleとstateを作る
公式Getting Startedに沿って見た目と表示状態を分離して定義します。
val style = rememberBalloonBuilder { setArrowSize(10.dp) setPadding(12.dp) setCornerRadius(8.dp) } val balloonState = rememberBalloonState(style) - 3
anchorからtooltipを表示する
ButtonをanchorとしてBalloonを表示し、位置追従と開閉を確認します。
Balloon( state = balloonState, balloonContent = { Text("Edit your profile") }, ) { Button(onClick = { balloonState.showAlignTop() }) { Text("Edit") } }
成長
成長の推移 · 直近30日
4,011 Stars
推移データを蓄積中です。
開発アクティビティ
直近90日・週次
- Commit(直近30日)
- 9
- Open PR
- 0
開発アクティビティを蓄積中です。
Built with
カテゴリとタグ
カテゴリ
GitHubデータ
GitHubのデータGitHubの詳細データを見る
GitHub Topics
- kotlin
- android
- android-library
- popup
- animation
- dsl
- balloon
- tooltip
- tooltips
- android-ui
- skydoves
- compose
- Stars
- 4,011
- Forks
- 310
- Watchers
- 25
- Open Issues
- 1
- Contributors
- 31
- 所有者種別
- User
- 主要言語
- Kotlin
- ライセンス
- Apache-2.0
- リポジトリ最終更新
- 2026/09/28
関連情報
関連記事を投稿するこのOSSの使い方や活用事例をMarkdownで投稿できます。管理者が承認した後に公開されます。
あわせて探訪
- Flutter179,343 Stars
共通タグ 2件 · 共通カテゴリ 2件
Dartの一つのcodebaseからmobile・web・desktop UIを構築するcross-platform SDK
Dart - Expo52,566 Stars
共通タグ 2件 · 共通カテゴリ 2件
React NativeアプリをAndroid・iOS・Webへ一つのprojectから展開する
TypeScript - Lottie for iOS26,894 Stars
共通タグ 2件 · 共通カテゴリ 2件
After Effects由来のJSON・.lottieアニメーションをApple platformでnative描画する
Swift - Kotlin53,479 Stars
共通タグ 2件 · 共通カテゴリ 1件 · 同じ言語
Java資産を活かしながらJVMからAndroid・iOS・desktop・Webへ広げる
Kotlin - LeakCanary30,005 Stars
共通タグ 2件 · 共通カテゴリ 1件 · 同じ言語
Androidアプリの保持オブジェクトを追跡し、メモリリークの経路を示す
Kotlin - Timber10,853 Stars
共通タグ 2件 · 共通カテゴリ 1件 · 同じ言語
Androidのログ出力を小さなAPIと交換可能な出力先で整理するKotlinライブラリ
Kotlin
情報の誤りを報告
掲載内容に誤りや古い情報があればお知らせください。