[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-9118":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":16,"stars7d":17,"stars30d":18,"stars90d":16,"forks30d":16,"starsTrendScore":19,"compositeScore":20,"rankGlobal":10,"rankLanguage":10,"license":21,"archived":22,"fork":22,"defaultBranch":23,"hasWiki":24,"hasPages":22,"topics":25,"createdAt":10,"pushedAt":10,"updatedAt":26,"readmeContent":27,"aiSummary":28,"trendingCount":16,"starSnapshotCount":16,"syncStatus":17,"lastSyncTime":29,"discoverSource":30},9118,"HistoryOfEverything","2d-inc\u002FHistoryOfEverything","2d-inc","Flutter Launch Timeline Demo","https:\u002F\u002Fmedium.com\u002F2dimensions\u002Fthe-history-of-everything-981d989e1b45",null,"Dart",6588,990,140,50,0,2,10,1,39.99,"MIT License",false,"master",true,[],"2026-06-12 02:02:03","# The History of Everything\n\n\u003Cimg align=\"right\" src=\"https:\u002F\u002Fcdn.2dimensions.com\u002F1_Start.gif\" height=\"400\">\n\nThe History of Everything is a vertical timeline that allows you to navigate, explore, and compare events from the Big Bang to the birth of the Internet. Events are beautifully illustrated and animated.\n\nThe concept for this app was inspired by the Kurzgesagt video, [Time: The History & Future of Everything](https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=5TbUxGZtwGI).\n\nThe app was built with [Flutter](https:\u002F\u002Fflutter.io\u002F) by [2Dimensions](https:\u002F\u002Fwww.2dimensions.com) and it's available on [Android](https:\u002F\u002Fplay.google.com\u002Fstore\u002Fapps\u002Fdetails?id=com.twodimensions.timeline) and [iOS](https:\u002F\u002Fitunes.apple.com\u002Fus\u002Fapp\u002Fthe-history-of-everything\u002Fid1441257460).\n\n## Usage\n\nMake sure you have Flutter installed on your local machine. For more instructions on how to install flutter, look [here](https:\u002F\u002Fflutter.io\u002Fdocs\u002Fget-started\u002Finstall).\n```\ngit clone https:\u002F\u002Fgithub.com\u002F2d-inc\u002FHistoryOfEverything.git\ncd HistoryOfEverything\u002Fapp\ngit submodule init\ngit submodule update\nflutter run\n```\n\n## Overview\n\u003Cimg align=\"right\" src=\"https:\u002F\u002Fcdn.2dimensions.com\u002F2_Scroll.gif\" height=\"400\">\n\nThe app consists of three main views:\n\n1. **Main Menu** - \u002Fapp\u002Flib\u002Fmain_menu\u003Cbr \u002F>\nThis is the initial view for the app when it opens up. It shows a search bar on top, three menu sections for each major time era, and three buttons on the bottom for accessing favorites, sharing a link to the store, and the about page.\u003Cbr \u002F>\n\n2. **Timeline** - \u002Fapp\u002Flib\u002Ftimeline\u003Cbr \u002F>\nThis view is displayed when an item from the menu is selected: the user is presented with a vertical timeline. It can be scrolled up and down, zoomed in and out. \u003Cbr\u002F>\nWhen an event is in view, a bubble will be shown on screen with a custom animated widget right next to it. By tapping on either, the user can access the ArticlePage.\n\n3. **ArticlePage** - \u002Fapp\u002Flib\u002Farticle\u003Cbr \u002F>\nThe ArticlePage displays the event animation, together with a full description of the event.\u003Cbr\u002F>\n\n## Animated Widgets\n\n\u003Cimg align=\"right\" src=\"https:\u002F\u002Fcdn.2dimensions.com\u002F3_Amelia.gif\" height=\"400\">\n\nThis relies heavily on the animations built on [2dimensions](https:\u002F\u002Fwww.2dimensions.com) and they are seamlessly integrated with Flutter by using the [Flare](https:\u002F\u002Fpub.dartlang.org\u002Fpackages\u002Fflare_flutter) and [Nima](https:\u002F\u002Fpub.dartlang.org\u002Fpackages\u002Fnima) libraries.\n\nOne of Flutter's biggest strengths is its flexibility, because it exposes the architecture of its components, which can be built entirely from scratch: it's possible to create custom widgets out of the SDK's most basic elements. \n\nAn example can be found in \u002Fapp\u002Flib\u002Farticle\u002Ftimeline_entry_widget.dart \u003Cbr\u002F>\nThis file contains two classes:\u003Cbr\u002F>\n- `TimelineEntryWidget` that extends `LeafRenderObjectWidget`\n- VignetteRenderObject that extends `RenderBox`\n\n## LeafRenderObjectWidget\n\nThis class ([docs](https:\u002F\u002Fdocs.flutter.io\u002Fflutter\u002Fwidgets\u002FLeafRenderObjectWidget-class.html)) is a `Widget`: it can be inserted in any widget tree without any other default component: \n\n```\nContainer(\n  child: TimelineEntryWidget(\n        isActive: true,\n        timelineEntry: widget.article,\n        interactOffset: _interactOffset\n    )\n)\n```\n\nThis snippet is used in \u002Fapp\u002Flib\u002Farticle\u002Farticle_widget.dart\n\nThe `LeafRenderObjectWidget` is responsible for having a constructor and encapsulating the values that the `RenderObject` needs.\n\nThe following two overrides are also fundamental:\n- `createRenderObject()` \u003Cbr \u002F>\nInstantiates the actual `RenderObject` in the Widget Tree;\n- `updateRenderObject()` \u003Cbr \u002F>\nAny change to the parameters that are passed to the Widget can be reflected also on the UI, if needed. Updating a `RenderObject` will cause the object to redraw.\n\n## RenderObject\n\nAs specified in the [docs](https:\u002F\u002Fdocs.flutter.io\u002Fflutter\u002Frendering\u002FRenderObject-class.html), this is an object in the render tree, and it defines what and how its creator Widget will paint on the screen.\n\nThe key override here is `paint()`:\u003Cbr \u002F>\n    the current `PaintingContext` exposes the `canvas`, and this class can draw, taking full advantage of the exposed API. \u003Cbr \u002F>\nThe [Flare library](https:\u002F\u002Fpub.dartlang.org\u002Fpackages\u002Fflare_flutter), granted access to the `canvas`, draws the animation.\u003Cbr\u002F>\nTo have the animation reproduce correctly, it's also necessary to call `advance(elapsed)` on the current `FlutterActor` each frame. Moreover, the current `ActorAnimation` requires that the function `apply(time)` is called on it to display it's correct interpolated values.\u003Cbr\u002F>\nThis is all made possible by relying on Flutter's `SchedulerBinding.scheduleFrameCallback()`.\n\nThis is just a brief overview of how the Flare widgets can be customized for every experience.\n\n## License\nAll the animations in the `\u002Fassets` folder are distributed under the **CC-BY** license.\n\nAll the articles in `assets\u002Farticles` are from [Wikipedia](https:\u002F\u002Fwww.wikipedia.org\u002F), and are thus distributed under the **GNU Free Documentation License**.\n\nThe rest of the repository's code and contents are distributed under the **MIT** license as specified in [LICENSE](LICENSE).\n","The History of Everything 是一个垂直时间轴应用，让用户能够浏览、探索和比较从宇宙大爆炸到互联网诞生之间的事件。项目使用 Flutter 和 Dart 语言构建，结合了精美的插图与动画效果，通过 Flare 和 Nima 库实现流畅的动画体验。该应用适合对历史感兴趣的用户以及希望学习如何利用 Flutter 创建复杂动画界面的开发者。它提供了主菜单、时间轴和文章详情页三个主要视图，支持事件搜索、缩放查看等功能，并且可以在 Android 和 iOS 平台上运行。","2026-06-11 03:21:19","top_language"]