A widget with side-by-side source code view.

Overview

widget_with_codeview

pub package GitHub

A widget with side-by-side source code view. Extracted from the flutter-catalog open-source app.

Usage

First make sure to add the source file to the app's assets by editing pubspec.yaml:

dependencies:
  flutter:
    sdk: flutter
  widget_with_codeview: '1.0.3'
flutter:
  assets:
    # Include a single source code file:
    - lib/my_awesome_source_code.dart
    # Include all files under a subfoler by adding trailing "/":
    - lib/my_awesome_source_code_subdir/
    - ...

Then wrap the widget from that source file by a WidgetWithCodeView:

WidgetWithCodeView(
  child: MyAwesomeWidget(),
  sourceFilePath: 'lib/my_awesome_source_code.dart',
  /// [codeLinkPrefix] is optional. When it's specified, two more buttons
  /// (open-code-in-browser, copy-code-link) will be added in the code view.
  codeLinkPrefix: 'https://github.com/
   
    /
    
     /blob/master/'
    
   ,
),

You can also choose to only show the code:

SourceCodeView(
  sourceFilePath: 'lib/my_awesome_source_code.dart',
  codeLinkPrefix: 'https://github.com/
   
    /
    
     /blob/master/'
    
   ,
),
You might also like...

Similar to Weibo dynamics, WeChat circle of friends, nine grid view controls to display pictures. Support single big picture preview.

Similar to Weibo dynamics, WeChat circle of friends, nine grid view controls to display pictures. Support single big picture preview.

Similar to Weibo dynamics, WeChat circle of friends, nine grid view controls to display pictures. Support single big picture preview.

Dec 28, 2022

NestedScrollView: extended nested scroll view to fix following issues.

NestedScrollView: extended nested scroll view to fix following issues.

Jan 4, 2023

Horizontal_calendar - Horizontal week view calendar pub for Flutter.

Horizontal_calendar - Horizontal week view calendar pub for Flutter.

horizontal_calendar Easy to use, highly customizable horizontal calendar. Features Custom date range (First & Last Date) Single or up to x days select

Dec 19, 2022

React hooks for Flutter. Hooks are a new kind of object that manages a Widget life-cycles. They are used to increase code sharing between widgets and as a complete replacement for StatefulWidget.

English | Português Flutter Hooks A Flutter implementation of React hooks: https://medium.com/@dan_abramov/making-sense-of-react-hooks-fdbde8803889 Ho

Dec 29, 2022

A Highly customizable Phone input Flutter widget that supports country code, validation and contact picker.

A Highly customizable Phone input Flutter widget that supports country code, validation and contact picker.

A Highly customizable Phone input Flutter widget that supports country code, validation and contact picker.

Jun 7, 2022

A simple Flutter widget to add in the widget tree when you want to show nothing, with minimal impact on performance.

nil A simple widget to add in the widget tree when you want to show nothing, with minimal impact on performance. Why? Sometimes, according to a condit

Dec 22, 2022

A flutter carousel widget, support infinite scroll, and custom child widget.

A flutter carousel widget, support infinite scroll, and custom child widget.

carousel_slider A carousel slider widget. Features Infinite scroll Custom child widgets Auto play Supported platforms Flutter Android Flutter iOS Flut

Nov 25, 2021

A Flutter Widget to make interactive timeline widget.

A Flutter Widget to make interactive timeline widget.

Bubble Timeline Package A Flutter Widget to make interactive timeline widget. This widget can be used to make Event Timelines, or Timelines for certai

Sep 22, 2022

Widget, that can make any static located widget hidable

Widget, that can make any static located widget hidable

Installing See the official installing guidline from hidable/install Usage & Overview To start using Hidable widget, we have to create a ScrollControl

Dec 16, 2022
Comments
  • 1. Change copy icon to copy code instead of link

    1. Change copy icon to copy code instead of link

    1. Added more parameters to ctor to customize the widget

    2. Changed folder/file structure to comform to standard

    3. Added copyWith to SyntaxHighlighterStyle

    4. Modified example app by removing example.dart and moving everything into main.dart

    5. Changed example app to show its own code and made it more verbose

    6. Fixed dark theme color issues

    darkTheme problem

    new:

    image

    opened by noga-dev 1
  • Create abstraction over SourceCodeView vs. WidgetWithCodeView

    Create abstraction over SourceCodeView vs. WidgetWithCodeView

    It would be nice if the top level widget could determine whether to show the SourceCodeView or the WidgetWithCodeView. Here is a working example

    import 'package:flutter/material.dart';
    import 'package:flutter/widgets.dart';
    import 'package:widget_with_codeview/source_code_view.dart';
    import 'package:widget_with_codeview/widget_with_codeview.dart';
    
    class CodeView extends StatelessWidget {
      final String filePath;
      final String? codeLinkPrefix;
      final Widget? child;
    
      const CodeView({
        Key? key,
        required this.filePath,
        this.child,
        this.codeLinkPrefix,
      }) : super(key: key);
    
      @override
      Widget build(BuildContext context) {
        if (child == null) {
          return SourceCodeView(
            filePath: filePath,
            codeLinkPrefix: codeLinkPrefix,
          );
        }
    
        return WidgetWithCodeView(
          child: child!,
          sourceFilePath: filePath,
          codeLinkPrefix: codeLinkPrefix,
        );
      }
    }
    
    
    opened by ryan-sf 1
  • feat: null safety migration

    feat: null safety migration

    The purpose of this pull request was to migrate the project to null safety, closing #6.

    What was done

    • Added example app to demonstrate the library
    • Swap out unsafe, unmaintained speed dial library with one that is more healthy
    • Run dart migrate and apply changes
    opened by ryan-sf 1
  • window.dart:519 Error while trying to load an asset: Failed to load asset at

    window.dart:519 Error while trying to load an asset: Failed to load asset at "assets/demo.dart" (404)

    I can't see my source code despite giving correct file path in the widget and in pubspec file also.

    What i cam doing wrong here?

    pubspec.yaml

    flutter:
      assets:
        - lib/
        - assets/demo.dart
    

    dart file

    SourceCodeView(
    filePath: 'demo.dart',
    codeLinkPrefix:
    'https://github.com/X-Wei/widget_with_codeview/blob/master/lib/source_code_view.dart',
     )
    

    assets path Screenshot 2021-01-11 at 4 23 07 PM

    opened by hiashutoshsingh 1
Releases(v2.0.1)
Owner
xwei
xwei
📸 Easy to use yet very customizable zoomable image widget for Flutter, Photo View provides a gesture sensitive zoomable widget.

?? Easy to use yet very customizable zoomable image widget for Flutter, Photo View provides a gesture sensitive zoomable widget. Photo View is largely used to show interacive images and other stuff such as SVG.

Blue Fire 1.7k Jan 7, 2023
A Flutter Widget that create a horizontal table with fixed column on left hand side.

horizontal_data_table A Flutter Widget that create a horizontal table with fixed column on left hand side. Installation This package is starting to su

May Lau 204 Dec 27, 2022
Flutter multiplatform navigation sidebar / side navigationbar / drawer widget

SidebarX ?? Flutter multiplatform navigation sidebar / side navigationbar / drawer widget Show some ❤️ and star the repo to support the project! Mobil

Stanislav Ilin 138 Jan 5, 2023
A widget to provides horizontal or vertical multiple split view for Flutter.

Multi split view A widget to provides horizontal or vertical multiple split view for Flutter. Horizontal or vertical Configurable weight or size for e

Carlos Eduardo Leite de Andrade 63 Dec 28, 2022
Flutter ScrollView Observer - a library of widget that can be used to listen for child widgets those are being displayed in the scroll view

Flutter ScrollView Observer - a library of widget that can be used to listen for child widgets those are being displayed in the scroll view

林洵锋 67 Jan 6, 2023
PowerFileView - A powerful file view widget, support a variety of file types, such as Doc Eexcl PPT TXT PDF and so on, Android is implemented by Tencent X5, iOS is implemented by WKWebView.

PowerFileView - A powerful file view widget, support a variety of file types, such as Doc Eexcl PPT TXT PDF and so on, Android is implemented by Tencent X5, iOS is implemented by WKWebView.

Yao 8 Oct 22, 2022
A Flutter widget which synchronize a ScrollView and a custom tab view

scrollable_list_tabview A Flutter widget which synchronize a ScrollView and a custom tab view. The main idea is to create a custom tab view synchroniz

Aswanath C K 0 Apr 12, 2022
🔍 Code generation for selectors of class fields that helps reduce repetitive code

Code generation for selectors of class fields and enum cases that helps reduce repetitive code.

Yakov K. 7 Oct 3, 2022
A customizable listview with A-Z side scrollbar to fast jump to the item of the selected character

A customizable listview with A-Z side scrollbar to fast jump to the item of the selected character

Liew Jun Tung 81 Sep 21, 2022
A customizable listview with A-Z side scrollbar to fast jump to the item of the selected character.

A customizable listview with A-Z side scrollbar to fast jump to the item of the selected character. Quick scroll through list via dragging through alphabets.

Hussain Al Lawati 1 Apr 3, 2022