DartCodeViewer class

A code viewer for the dart language.

A code viewer can be used to display dart code. By default the DartCodeViewer gives you a Theme based code view. If you are using a ThemeMode that is light than you will get the light option. Note that the default background of the code viewer is based off ColorScheme.background.

Supplying a non-null data String is required as input.

Requires one of its ancestors to be a Material widget.

Requires one of its ancestors to be a MediaQuery widget. Typically, these are introduced by the MaterialApp or WidgetsApp widget at the top of your application widget tree.

{@tool dartpad --template=stateless_widget_scaffold}

![A dart_code_viewer example for light mode.] (https://github.com/JoseAlba/dart_code_viewer/images/import_example)

Here is an example of a small string that shows up as Dart code in a flutter application.

@override
Widget build(BuildContext context) {
  return DartCodeViewer(r'class DartCodeViewer extends StatelessWidget {}');
}

{@end-tool}

See also:

  • DartCodeViewerTheme and DartCodeViewerThemeData for information about controlling the visual appearance of the DartCodeViewer.
  • Code viewer online tool is a useful tool that lets you choose the color for each different style. On the left side you put your example code and on the right you can choose the colors you want the code viewer to display. background => backgroundColor plain text => baseStyle Punctuation => punctuationStyle String, values => stringStyle Keywords, tags => keywordStyle Comments => commentStyle Types => classStyle Numbers => numberStyle Declarations => constantStyle
  • MediaQuery, from which the default height and width factor is obtained.
Inheritance

Constructors

DartCodeViewer(String data, {Key? key, TextStyle? baseStyle, TextStyle? classStyle, TextStyle? commentStyle, TextStyle? constantStyle, TextStyle? keywordStyle, TextStyle? numberStyle, TextStyle? punctuationStyle, TextStyle? stringStyle, Color? backgroundColor, Text? copyButtonText, bool? showCopyButton, double? height, double? width})
DartCodeViewer requires a String that will be the code shown within the code viewer. This should be dart code and it is preferable if you use a raw string by adding an r before the string.
const
DartCodeViewer.dark(String data)
Common code viewer highlighter for ThemeMode.dark.
factory
DartCodeViewer.darkAlt(String data)
Code viewer dark alternative for ThemeMode.dark.
factory
DartCodeViewer.designDark(String data)
Code viewer highlighter with a great dark design for ThemeMode.dark.
factory
DartCodeViewer.flutterInteract19(String data)
Code viewer highlighter for Flutter Interact 2019.
factory
DartCodeViewer.io17(String data)
Code viewer highlighter for Google IO 2017.
factory
DartCodeViewer.io19(String data)
Code viewer highlighter for Google IO 2019.
factory
DartCodeViewer.light(String data)
Common code viewer highlighter for ThemeMode.light.
factory
DartCodeViewer.lightAlt(String data)
Code viewer light alternative for ThemeMode.light.
factory
DartCodeViewer.textColor(String data, {TextStyle? textStyle, Color? baseColor, Color? classColor, Color? commentColor, Color? constantColor, Color? keywordColor, Color? numberColor, Color? punctuationColor, Color? stringColor, Color? backgroundColor, Text? copyButtonText, bool? showCopyButton, double? height, double? width})
Create a DartCodeViewer based of one TextStyle. Optional Color parameters which change the TextStyle color for that highlighter type.
factory

Properties

backgroundColor → Color?
The background Color of the code. By default it is Theme.of(context).colorScheme.background.
final
baseStyle → TextStyle?
The text style for the plain text in code.
final
classStyle → TextStyle?
The text style for the code types in the code.
final
commentStyle → TextStyle?
The text style for the commented out code.
final
constantStyle → TextStyle?
The text style for the constant style code.
final
copyButtonText → Text?
The text shown in the copy button by default it is 'COPY ALL'.
final
data → String
The string that is transformed into code. This is a required variable.
final
hashCode → int
The hash code for this object.
no setterinherited
height → double?
The height of the DartCodeViewer by default it uses the MediaQuery.of(context).size.height
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
keywordStyle → TextStyle?
The text style for keywords. For example:
final
numberStyle → TextStyle?
The text style for numbers within the code.
final
punctuationStyle → TextStyle?
The text style for punctuation code like periods and commas.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
showCopyButton → bool?
Shows copy button that lets user copy all the code as a raw string. By default the button is showing.
final
stringStyle → TextStyle?
The text style for Strings. For example the data when using the Text widget.
final
width → double?
The width of the DartCodeViewer by default it uses the MediaQuery.of(context).size.width
final

Methods

build(BuildContext context) → Widget
Describes the part of the user interface represented by this widget.
override
codifyString(String content, DartCodeViewerThemeData dartCodeViewerThemeData) → InlineSpan
createElement() → StatelessElement
Creates a StatelessElement to manage this widget's location in the tree.
inherited
debugDescribeChildren() → List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
decodeString(String string) → String
Read raw string as regular String. Converts Unicode characters to actual numbers.
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
stringToTextSpan(String string, DartCodeViewerThemeData dartCodeViewerThemeData) → TextSpan
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a one-line detailed description of the object.
inherited
toStringShort() → String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
inherited