Floating UI Reactで作るUIコンポーネント
- カテゴリー
- UIライブラリ／UIフレームワーク >
- React／Preact
全3回
単一の機能特化型のUIライブラリであるFloating UI Reactを使って、ReactでのUIコンポーネントの作成例を解説します。ポップオーバー、セレクトボックス、コンボボックスをつくっていきましょう。
第3回 ポップオーバーUI：アクセシビリティとコンポーネント化
ひととおりのポップオーバーUIの実装を終えたので、アクセシビリティの付与とコンポーネント化を行い、完成させます。
第2回 ポップオーバーUI：重なりや切れの解決と配置調整
前回はポップオーバーの開閉や閉じる処理を実装しました。今回は、ポータル化で表示の切れや重なりを防ぎ、flipで位置を自動調整する方法を解説します。
第1回 ポップオーバーUI：パネルの作成と開閉機能の実装
単機能のUIライブラリ「Floating UI React」を使って、ReactでポップオーバーUIを作る方法を解説します。今回は、ポップオーバーのパネルの作成と開閉機能の実装について説明します。