Network Debugger Docs

Appearance

hex_viewer_widget›Classes

HexViewer ​

class HexViewer

A hexadecimal viewer widget for displaying binary data with advanced features.

This widget provides a professional hex editor-style view of binary data with:

  • Virtualized scrolling for handling large files efficiently
  • Byte selection with Shift+click for range selection
  • Copy to clipboard in hex, text, or binary format
  • Configurable byte grouping and display options
  • Color-coded bytes (null bytes, ASCII, control chars)
  • Dark and light theme support

Example:

dart
HexViewer(
  data: myBinaryData,
  config: HexConfig(
    bytesPerLine: 16,
    groupSize: 8,
    colorScheme: ByteColorScheme.fromTheme(Theme.of(context)),
  ),
  onSelectionChanged: (selection) {
    print('Selected: ${selection?.length} bytes');
  },
)

See also:

Constructors ​

HexViewer() const ​

const HexViewer({
  dynamic key,
  required List<int> data,
  HexConfig config = const HexConfig(),
  dynamic onSelectionChanged,
  String? monospaceFontFamily,
})

Creates a hexadecimal viewer widget.

The data parameter is required and contains the binary data to display. All other parameters are optional with sensible defaults.

Implementation
dart
const HexViewer({
  super.key,
  required this.data,
  this.config = const HexConfig(),
  this.onSelectionChanged,
  this.monospaceFontFamily,
});

Properties ​

config final ​

final HexConfig config

Display configuration including bytes per line, grouping, and colors.

Defaults to HexConfig() with standard settings (16 bytes per line, 8-byte grouping). See HexConfig for all available options.

Implementation
dart
final HexConfig config;

data final ​

final List<int> data

Binary data to display as hexadecimal.

This can be any List<int> including file contents, network packets, or any binary data. The widget efficiently handles large data sets using virtualized scrolling.

Implementation
dart
final List<int> data;

hashCode no setter inherited ​

int get hashCode

The hash code for this object.

A hash code is a single integer which represents the state of the object that affects operator == comparisons.

All objects have hash codes. The default hash code implemented by Object represents only the identity of the object, the same way as the default operator == implementation only considers objects equal if they are identical (see identityHashCode).

If operator == is overridden to use the object state instead, the hash code must also be changed to represent that state, otherwise the object cannot be used in hash based data structures like the default Set and Map implementations.

Hash codes must be the same for objects that are equal to each other according to operator ==. The hash code of an object should only change if the object changes in a way that affects equality. There are no further requirements for the hash codes. They need not be consistent between executions of the same program and there are no distribution guarantees.

Objects that are not equal are allowed to have the same hash code. It is even technically allowed that all instances have the same hash code, but if clashes happen too often, it may reduce the efficiency of hash-based data structures like HashSet or HashMap.

If a subclass overrides hashCode, it should override the operator == operator as well to maintain consistency.

Inherited from Object.

Implementation
dart
external int get hashCode;

monospaceFontFamily final ​

final String? monospaceFontFamily

Optional custom monospace font family for hex and ASCII display.

If not provided, uses the default monospace font from the theme. Recommended fonts: 'Courier New', 'Monaco', 'Consolas', 'Roboto Mono'.

Implementation
dart
final String? monospaceFontFamily;

onSelectionChanged final ​

final dynamic onSelectionChanged

Callback invoked when the user selects or deselects bytes.

Returns null when selection is cleared, or a ByteSelection object containing the start offset, end offset, and selected bytes.

Example:

dart
onSelectionChanged: (selection) {
  if (selection != null) {
    print('Selected ${selection.length} bytes from '
          '${selection.start} to ${selection.end}');
  }
}
Implementation
dart
final ValueChanged<ByteSelection?>? onSelectionChanged;

runtimeType no setter inherited ​

Type get runtimeType

A representation of the runtime type of the object.

Inherited from Object.

Implementation
dart
external Type get runtimeType;

Methods ​

createState() ​

dynamic createState()
Implementation
dart
@override
State<HexViewer> createState() => _HexViewerState();

noSuchMethod() inherited ​

dynamic noSuchMethod(Invocation invocation)

Invoked when a nonexistent method or property is accessed.

A dynamic member invocation can attempt to call a member which doesn't exist on the receiving object. Example:

dart
dynamic object = 1;
object.add(42); // Statically allowed, run-time error

This invalid code will invoke the noSuchMethod method of the integer 1 with an Invocation representing the .add(42) call and arguments (which then throws).

Classes can override noSuchMethod to provide custom behavior for such invalid dynamic invocations.

A class with a non-default noSuchMethod invocation can also omit implementations for members of its interface. Example:

dart
class MockList<T> implements List<T> {
  noSuchMethod(Invocation invocation) {
    log(invocation);
    super.noSuchMethod(invocation); // Will throw.
  }
}
void main() {
  MockList().add(42);
}

This code has no compile-time warnings or errors even though the MockList class has no concrete implementation of any of the List interface methods. Calls to List methods are forwarded to noSuchMethod, so this code will log an invocation similar to Invocation.method(#add, [42]) and then throw.

If a value is returned from noSuchMethod, it becomes the result of the original invocation. If the value is not of a type that can be returned by the original invocation, a type error occurs at the invocation.

The default behavior is to throw a NoSuchMethodError.

Inherited from Object.

Implementation
dart
@pragma("vm:entry-point")
@pragma("wasm:entry-point")
external dynamic noSuchMethod(Invocation invocation);

toString() inherited ​

String toString()

A string representation of this object.

Some classes have a default textual representation, often paired with a static parse function (like int.parse). These classes will provide the textual representation as their string representation.

Other classes have no meaningful textual representation that a program will care about. Such classes will typically override toString to provide useful information when inspecting the object, mainly for debugging or logging.

Inherited from Object.

Implementation
dart
external String toString();

Operators ​

operator ==() inherited ​

bool operator ==(Object other)

The equality operator.

The default behavior for all Objects is to return true if and only if this object and other are the same object.

Override this method to specify a different equality relation on a class. The overriding method must still be an equivalence relation. That is, it must be:

  • Total: It must return a boolean for all arguments. It should never throw.

  • Reflexive: For all objects o, o == o must be true.

  • Symmetric: For all objects o1 and o2, o1 == o2 and o2 == o1 must either both be true, or both be false.

  • Transitive: For all objects o1, o2, and o3, if o1 == o2 and o2 == o3 are true, then o1 == o3 must be true.

The method should also be consistent over time, so whether two objects are equal should only change if at least one of the objects was modified.

If a subclass overrides the equality operator, it should override the hashCode method as well to maintain consistency.

Inherited from Object.

Implementation
dart
external bool operator ==(Object other);

Static Methods ​

buildStaticSlivers() ​

List<dynamic> buildStaticSlivers({
  required dynamic context,
  required List<int> data,
  required HexConfig config,
  String? monospaceFontFamily,
})

Builds slivers for displaying hex data in a CustomScrollView without state.

This is a static method that creates read-only hex viewer slivers without interactive features like selection or copy. Use this when you need to embed hex data in a CustomScrollView without nested scroll conflicts.

Returns an empty list if data is empty.

Example:

dart
CustomScrollView(
  slivers: [
    ...HexViewer.buildStaticSlivers(
      context: context,
      data: myData,
      config: HexConfig(),
    ),
  ],
)
Implementation
dart
static List<Widget> buildStaticSlivers({
  required BuildContext context,
  required List<int> data,
  required HexConfig config,
  String? monospaceFontFamily,
}) {
  if (data.isEmpty) {
    return [
      SliverToBoxAdapter(
        child: Center(
          child: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Text(
              'No data to display',
              style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                color: Theme.of(context).colorScheme.onSurfaceVariant,
              ),
            ),
          ),
        ),
      ),
    ];
  }

  final effectiveConfig = _resolveDefaultColorScheme(
    context: context,
    config: config,
  );

  final monoStyle = TextStyle(
    fontFamily: monospaceFontFamily ?? 'monospace',
    fontSize: 13,
  );

  final lineCount = HexFormatter.calculateLineCount(
    data.length,
    config.bytesPerLine,
  );

  return [
    &#47;&#47; Header
    SliverToBoxAdapter(
      child: HexHeader(config: effectiveConfig, monoStyle: monoStyle),
    ),

    const SliverToBoxAdapter(child: Divider(height: 1)),

    &#47;&#47; Hex rows as SliverList (virtualized, no scroll conflict)
    SliverList(
      delegate: SliverChildBuilderDelegate((context, index) {
        final offset = index * effectiveConfig.bytesPerLine;
        final line = HexFormatter.formatLine(data, offset, effectiveConfig);

        return HexRow(
          line: line,
          config: effectiveConfig,
          selection: null, &#47;&#47; Read-only mode, no selection
          monoStyle: monoStyle,
          onBytePressed: null, &#47;&#47; Read-only mode, no interaction
        );
      }, childCount: lineCount),
    ),
  ];
}