{"id":19197522,"url":"https://github.com/rikulo/uxl","last_synced_at":"2025-10-03T21:45:13.869Z","repository":{"id":5128248,"uuid":"6293895","full_name":"rikulo/uxl","owner":"rikulo","description":"Rikulo UXL (User-interface eXtensible Language) is a markup language allowing developers to define user-interface in XML, and then compile and debug it in Dart.","archived":false,"fork":false,"pushed_at":"2013-12-29T14:22:09.000Z","size":577,"stargazers_count":5,"open_issues_count":0,"forks_count":1,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-06-05T01:31:15.500Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://rikulo.org","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"fellam/RecurrentEventCalendar","license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rikulo.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGES.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2012-10-19T11:29:06.000Z","updated_at":"2024-05-10T10:30:45.000Z","dependencies_parsed_at":"2022-08-06T18:01:07.359Z","dependency_job_id":null,"html_url":"https://github.com/rikulo/uxl","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/rikulo/uxl","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rikulo%2Fuxl","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rikulo%2Fuxl/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rikulo%2Fuxl/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rikulo%2Fuxl/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rikulo","download_url":"https://codeload.github.com/rikulo/uxl/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rikulo%2Fuxl/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":262689455,"owners_count":23349133,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-09T12:17:10.845Z","updated_at":"2025-10-03T21:45:13.750Z","avatar_url":"https://github.com/rikulo.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"#Rikulo UXL\r\n\r\n[Rikulo UXL](http://rikulo.org) (User-interface eXtensible language) is a markup language for describing applications' user interfaces. UXL is a simple variant of XML. It allows you to define user interfaces in a similar manner to authoring HTML and XML pages. It also allows you to use the Model-View-Controller (MVC) pattern to develop applications.\r\n\r\n* [Home](http://rikulo.org)\r\n* [UXL Documentation](http://docs.rikulo.org/ui/latest/UXL)\r\n* [UXL API Reference](http://api.rikulo.org/uxl/latest/)\r\n* [Discussion](http://stackoverflow.com/questions/tagged/rikulo)\r\n* [Source Code Repos](https://github.com/rikulo/uxl)\r\n* [Issues](https://github.com/rikulo/uxl/issues)\r\n\r\nRikulo UXL is distributed under the Apache 2.0 License.\r\n\r\n##Installation\r\n\r\nAdd this to your `pubspec.yaml` (or create it):\r\n\r\n    dependencies:\r\n      rikulo_uxl:\r\n\r\nThen run the [Pub Package Manager](http://pub.dartlang.org/doc) (comes with the Dart SDK):\r\n\r\n    pub install\r\n\r\n##Usage\r\n\r\nFirst, you have to prepare UXL files defining the user interface. Next, there are two ways to compile it into dart files: automatic building with Dart Editor or manual compiling.\r\n\r\n###Build with Dart Editor\r\n\r\nTo compile your UXL files automatically, you just need to add a build.dart file in the root directory of your project, with the following content:\r\n\r\n\timport 'package:rikulo_uxl/uc.dart' show build;\r\n\r\n\tvoid main(List\u003cString\u003e arguments) {\r\n\t\tbuild(arguments);\r\n\t}\r\n\r\nWith this build.dart script, whenever your UXL is modified, it will be re-compiled.\r\n\r\n###Compile Manually\r\n\r\nTo compile a UXL file manually, run `uc` (UXL compiler) to compile it into the dart file with [command line interface](http://en.wikipedia.org/wiki/Command-line_interface) as follows:\r\n\r\n    dart bin/uc.dart your-uxl-file(s)\r\n\r\nA dart file is generated for each UXL file you gave.\r\n\r\n###UXL and Its Generated Dart File\r\n\r\nA UXL file can define one or multiple templates. For example, here is a UXL file defining a template called `ScrollViewTemplate`:\r\n\r\n```xml\r\n  \u003cTemplate name=\"ScrollViewTemplate\" args=\"rows: 30, cols: 30\"\u003e\r\n    \u003cScrollView class=\"scroll-view\"\r\n    profile=\"location: center center; width: 80%; height: 80%\"\u003e\r\n        \u003cApply forEach=\"r = 0; r \u003c rows; ++r\"\u003e\r\n          \u003cApply forEach=\"c = 0; c \u003c cols; ++c\"\u003e\r\n            \u003cView style=\"border: 1px solid #553; background-color: ${CSS.color(250 - r * 4, 250 - c * 4, 200)}\"\r\n                left=\"${r * 50 + 2}\" top=\"${c * 50 + 2}\"\r\n                width=\"${46}\" height=\"${46}\"\u003e\r\n            \u003c/View\u003e\r\n          \u003c/Apply\u003e\r\n        \u003c/Apply\u003e\r\n    \u003c/ScrollView\u003e\r\n  \u003c/Template\u003e\r\n```\r\n\r\nA template is actually compiled to a Dart function with the name specified in UXL:\r\n\r\n    List\u003cView\u003e ScrollViewTemplate({parent, rows: 30, cols: 30}) {\r\n      List\u003cView\u003e _vcr_ = new List();\r\n      var _this_;\r\n\r\n      final _v0_ = _this_ = new ScrollView()\r\n      ...\r\n      _vcr_.add(_v0_);\r\n      ...\r\n      return _vcr_;\r\n    }\r\n\r\n\u003e For a complete dart file, please refer to [here](https://github.com/rikulo/uxl/blob/master/example/scroll-view/ScrollView.uxl.dart).\r\n\r\nHaving you UXL compiled, you can instantiate views based on the template whatever you want:\r\n\r\n    void main() {\r\n      final View mainView = new View()..addToDocument();\r\n      ScrollViewTemplate(parent: mainView);\r\n    }\r\n\r\n##Pros and Cons\r\n\r\n###Pros\r\n\r\n* The user interface can be defined easily in a similar manner to HTML and XML pages.\r\n* MVC/MVP and data-binding for improving the separation of view, model and controller.\r\n* Performance is as good as expressing in Dart.\r\n* Easy to debug since the generated Dart code is easy to understand.\r\n\r\n###Cons\r\n\r\n* It has to be compiled to Dart in advance.\r\n\r\n##Notes to Contributors\r\n\r\n###Create Addons\r\n\r\nRikulo is easy to extend. The simplest way to enhance Rikulo is to [create a new repository](https://help.github.com/articles/create-a-repo) and add your own great widgets and libraries to it.\r\n\r\n###Fork Rikulo UXL\r\n\r\nIf you'd like to contribute back to the core, you can [fork this repository](https://help.github.com/articles/fork-a-repo) and send us a pull request, when it is ready.\r\n\r\nPlease be aware that one of Rikulo's design goals is to keep the sphere of API as neat and consistency as possible. Strong enhancement always demands greater consensus.\r\n\r\nIf you are new to Git or GitHub, please read [this guide](https://help.github.com/) first.\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frikulo%2Fuxl","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frikulo%2Fuxl","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frikulo%2Fuxl/lists"}