Search packages, repositories and app categories

ducafecatFlutter ecosystem guide
Package detailsv0.5.0

signal_strength_indicator

Customizable signal strength indicator widget for Flutter. Allows to easily visualize signal strength.

AndroidiOSWebmacOSWindowsLinux
pub.dev API documentation Source code
30-day downloads
9.8K
Likes
35
Pub points
160

Install package

flutter pub add signal_strength_indicator

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

A customizable Flutter widget that visually represents signal strength, ideal for network connectivity monitoring. It provides a simple way to display signal levels with adjustable styling and behavior. The indicator supports multiple platforms including Android, iOS, Web, macOS, Windows, and Linux, making it suitable for cross-platform applications. Designed for developers who need a clean, responsive signal visualization without complex implementation.

Use cases

  • Network status dashboards
  • Mobile app connectivity indicators
  • IoT device connection monitors
  • Real-time signal level displays
  • User-friendly network feedback

Key features

  • Customizable appearance
  • Cross-platform compatibility
  • Simple integration
  • Responsive signal visualization
  • Configurable signal thresholds

Suitable for

  • Developers building network-aware apps
  • UI designers needing signal indicators
  • Applications requiring real-time connectivity feedback
  • Cross-platform mobile and desktop apps
  • Projects with minimal dependency requirements

Considerations

  • Requires manual signal value input
  • Limited to visual representation only
  • No built-in signal measurement
  • Best used with external signal data sources
  • May need additional styling for dark mode

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

Signal strength indicator widget

Pub CI Demo

Customizable signal strength indicator widget for Flutter.

Contents

Requirements

  • Dart SDK: >=3.0.0
  • Flutter: >=3.10.0

Features

See the WEB DEMO.

Two visual variants:

  • Bars — classic stacked bars with optional rounded corners, bevelled style, and spacing
  • Sector — quarter-circle arc segments with optional rounded caps

Installation

Add this to your pubspec.yaml:

dependencies:
  signal_strength_indicator: ^0.5.0

Then run:

flutter pub get

Import in your Dart code:

import 'package:signal_strength_indicator/signal_strength_indicator.dart';

Usage

Bars
SignalStrengthIndicator.bars(
  value: 0.6,
  size: 40,
  barCount: 4,
  spacing: 0.2,
  activeColor: Colors.green,
  inactiveColor: Colors.grey.shade300,
)
Sector
SignalStrengthIndicator.sector(
  value: 0.6,
  size: 40,
  barCount: 4,
  spacing: 0.3,
  rounded: true,
)
Custom value range
SignalStrengthIndicator.bars(
  value: -65,     // e.g. RSSI in dBm
  minValue: -100,
  maxValue: -40,
  size: 40,
)
Threshold-based coloring with levels

levels is a Map<num, Color> mapping absolute thresholds to colors. A bar/segment becomes active and uses the color of the highest threshold that is <= the current value.

SignalStrengthIndicator.bars(
  value: signalValue,
  minValue: 0,
  maxValue: 100,
  size: 40,
  barCount: 3,
  levels: {
    33: Colors.red,
    66: Colors.orange,
    100: Colors.green,
  },
)
Rounded corners and bevelled bars
// Rounded corners
SignalStrengthIndicator.bars(
  value: 0.7,
  size: 40,
  radius: const Radius.circular(4),
)

// Bevelled (each bar steps up at an angle)
SignalStrengthIndicator.bars(
  value: 0.7,
  size: 40,
  bevelled: true,
)

Parameters

Common parameters (bars and sector)
Parameter Type Default Description
value num required Current signal value
minValue num? 0.0 Minimum value of the range
maxValue num? 1.0 Maximum value of the range
size double? icon theme size Width and height of the widget
barCount int 3 Number of bars/segments
activeColor Color? green Color of active bars (when no levels)
inactiveColor Color? light green Color of inactive bars
levels Map<num, Color>? — Threshold-to-color mapping (absolute values)
spacing double 0.2 / 0.3 Gap between bars as a fraction of bar size
margin EdgeInsets zero Outer margin around the widget
Bars-only parameters
Parameter Type Default Description
radius Radius? Radius.zero Corner radius of each bar
bevelled bool false Draw bars with an angled top edge
Sector-only parameters
Parameter Type Default Description
rounded bool false Use rounded arc cap ends

Feature requests and bugs

Please file feature requests and bugs at the issue tracker.

Categories

Network Connectivity Status

Source repository

Projects using this package