Giter Club home page Giter Club logo

assets-for-api-docs's Introduction

assets-for-api-docs

This repo is used to host and serve static assets in support of docs.flutter.dev, as well as some manual tests that use specially-crafted graphics.

Assets committed to this repo and pushed to GitHub are immediately available for linking and reference.

URL structure

Reference the assets with this URL structure:

https://flutter.github.io/assets-for-api-docs/assets/<library>/<asset>

For example, an image named app_bar.png about AppBar from the material library would go in the assets/material/ directory and be at https://flutter.github.io/assets-for-api-docs/assets/material/app_bar.png.

All asset files should be under the assets directory in an appropriate subdirectory.

Generation

Images must be code-generated.

To create new images, see the packages/diagrams/lib/src/ directory.

The generate.dart script regenerates almost all of existing assets using the Flutter version you have installed. A small wrapper bin/generate.sh is provided as a convenience.

To limit image generation to certain categories and/or names, run:

# Filter by category
bin/generate.sh -c cupertino,material
# Filter by name
bin/generate.sh -n basic_material_app,blend_mode

bin/generate.sh --help lists available arguments.

Prerequisites

The generate.dart script only works on macOS and Linux, because of the supporting apps it needs to run.

To optimize PNG files, it needs optipng, which is available for macOS via Homebrew, and Linux via apt-get.

To convert animations into mp4 files, it needs ffmpeg, available for macOS via Homebrew and Linux via apt-get.

flutter, dart (and when using an Android device, adb) commands need to be available in a directory in the PATH environment variable. (e.g. PATH=/<path_to_flutter>/flutter/bin/cache/dart-sdk/bin:/Android/Sdk/platform-tools:$PATH)

When using an Android device, be sure that the adb command is the same as the one running as a server (which is often started by your IDE, so use the same adb the IDE is running).

Optimization

Please consider optimization tools for assets.

For PNGs, we recommend optipng, using the following command line:

optipng -zc1-9 -zm1-9 -zs0-3 -f0-5 *.png

Be careful about applying this aggressively. In particular, files in the assets/tests directory should not be optimized.

The automatic generation tool will automatically apply optimization to the assets it generates.

Creating new diagrams

To create a new diagram:

  1. Add a new file to packages/diagrams/lib/src/, and put the tests in there.

  2. Export that file from packages/diagrams/lib/diagrams.dart.

  3. Add your new class to the list in assets-for-api-docs/utils/diagram_generator/lib/main.dart.

  4. Run generate.sh --name xxx where 'xxx' is the name of your diagram.

Origin of third-party content

assets-for-api-docs's People

Contributors

amirh avatar brianegan avatar darrenaustin avatar dkwingsmt avatar dnfield avatar garyqian avatar goderbauer avatar gspencergoog avatar guidezpl avatar hixie avatar josealba avatar josepbove avatar jslavitz avatar mit-mit avatar piinks avatar pragya007 avatar royarg02 avatar sethladd avatar shihaohong avatar tvolkert avatar xqwzts avatar xster avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.