カテゴリー・パッケージ・リポジトリを検索

inspector のカバー
パッケージ詳細v4.0.0

inspector

ウィジェットを検査するためのFlutterパッケージ。迅速なデバッグやQAテストに役立ちます。

AndroidiOSWebmacOSWindowsLinux
30日間ダウンロード
51.2万
いいね数
87
Pub ポイント
150

パッケージをインストール

flutter pub add inspector

パッケージ概要

公開情報に基づく選定ガイドです。参考としてご利用ください。

インスペクターパッケージは、Flutter用のツールで、リアルタイムでのウィジェットの検査を目的として設計されています。これにより、開発者やテスト担当者はUIの問題を迅速にデバッグしたり、QAチェックを行ったりできます。このツールは、デバイスまたはエミュレーター上でウィジェットツリー、そのプロパティ、レイアウト動作を直接調べられるインタラクティブなオーバーレイを提供します。開発中の迅速なフィードバックに最適であり、複雑なセットアップなしにUI構造の可視性を高めます。このパッケージはすべての主要プラットフォームをサポートしており、さまざまな環境で柔軟に利用可能です。

用途

  • クイックUIデバッグ
  • QAテスト
  • リアルタイムウィジェット分析
  • 開発フィードバックループ
  • クロスプラットフォームUI検証

主な機能

  • インタラクティブなウィジェットオーバーレイ
  • ライブプロパティの検査
  • すべての Flutter プラットフォームをサポートしています
  • 最小限のセットアップが必要
  • 開発者以外のユーザー向けの直感的なUI

適している対象

  • Developers
  • QA テスター
  • UIデザイナー
  • 迅速なプロトタイピングチーム

注意事項

  • 本番ビルドには適していません
  • 大規模なアプリにおいてパフォーマンスに影響を与える可能性があります
  • オーバーレイはテスト中にUIに影響を与える可能性があります
  • 手動での有効化が必要です
  • 視覚検査のみに限定

元の README

関連するソースリポジトリの README 原文のスナップショットです。最新の内容はリポジトリをご覧ください。

inspector

Pub Version GitHub Workflow Status Coverage Status GitHub Repo stars

A Flutter package for inspecting widgets. Also comes with an eyedropper and a magnifying glass. Useful for debugging widgets and for QA testing.

Supports keyboard shortcuts if you're using a physical keyboard.

Check out the example web app!

Inspired by inspx.

WIP

Warning, the development of this package is still in progress and some things may break your app.

Features

  • [x] Color picker
  • [x] Size inspection
  • [x] Padding inspection
  • [x] Keyboard shortcuts
  • [x] Zooming
  • [ ] BorderRadius inspection
  • [x] TextStyle inspection

Installing

Add the dependency:

$ flutter pub add inspector

Import the package:

import 'package:inspector/inspector.dart';

Wrap MaterialApp.builder or WidgetsApp.builder with Inspector:

MaterialApp(
  home: ExampleApp(),
  builder: (context, child) => Inspector(child: child!), // Wrap [child] with [Inspector]
),

Optionally, you can pass isEnabled to the Inspector to disable it. By default, the inspector is disabled when kReleaseMode == true.

Usage

If the inspector is enabled, then a panel appears on the right side of the screen, with buttons to toggle size inspection and the color picker.

It's quite straightforward to use, just tap on the widget that you want to measure or tap on the pixel to get its color.

You can also use keyboard shortcuts - Shift will toggle the color picker, Z will toggle the zoom, and Alt or Cmd will toggle the widget inspector.

Examples

Contact me

Feel free to contact me at:

E-mail: kk.erzhan@gmail.com

カテゴリー

ソースリポジトリ

このパッケージを使用しているプロジェクト