[
{
"path": ".github/FUNDING.yml",
"content": "# These are supported funding model platforms\n\ngithub: [LudiKha] # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2]\npatreon: # Replace with a single Patreon username\nopen_collective: # Replace with a single Open Collective username\nko_fi: # Replace with a single Ko-fi username\ntidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel\ncommunity_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry\nliberapay: # Replace with a single Liberapay username\nissuehunt: # Replace with a single IssueHunt username\notechie: # Replace with a single Otechie username\ncustom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']\n"
},
{
"path": "LICENSE",
"content": "MIT License\n\nCopyright (c) 2020 Khaya Ludidi - CupBearer Interactive\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
},
{
"path": "README.md",
"content": "
\n \n
\n\n \n\n[](https://opensource.org/licenses/MIT)   [](https://twitter.com/intent/follow?screen_name=LudiKha)\n\nGraphene is a lightweight and modular framework for building runtime user interfaces with Unity's [UI Toolkit][0f273cb2].\n\n[0f273cb2]: https://docs.unity3d.com/2020.1/Documentation/Manual/UIElements.html \"UI Toolkit\"\n\n \n\n# Intro\n\nGraphene **superconducts** your creativity for efficiently building modern interactive UI for games. It takes care of the heavy lifting by providing a framework inspired by Web standards, right into Unity.\n\nIt's **lightweight** and modular - you get to pick and choose which parts you need for your projects.\n\n- **Declarative Hierarchy**: Graphene makes it painless to design interactive UI. Use the familiar GameObjects hierarchy to design simple `Views` as sections of the screen or nested states.\n- **Reduce Boilerplate**: Focus on your custom logic and design of building UI instead of repeating low-level tasks for each unique screen you are building. Graphene comes with a number of `Controls` that greatly enhance the speed of creating interactive UI, whilst reducing the need of custom view controllers in C# by exposing vital functionality in Uxml.\n- **Attribute-Based**: Instruct your UI to both draw _and_ bind templates using any data-container with a `[Bind]` attribute. Primitives, objects, collections, one-way, two-way binding, specific control selection: the parts you'll be most frequently developing with in C# are exposed via attributes\n- **State-Based Routing**: Use the GameObject hierarchy dynamically construct your router's states. Its functionality mimics url-based addresses: `index/settings/video`.\n- **Template Composition**: Reuse your static assets by writing atomic templates, and dynamically compose them in runtime.\n\nIt comes with a **[component-kit][e593c071]** library, **[sample project][05f1d8f6]** several VisualElement extensions and an **[online demo][84ed822d]** to get you started.\n\n [e593c071]: https://github.com/LudiKha/Graphene-Components \"Graphene Components\"\n [05f1d8f6]: https://github.com/LudiKha/Graphene-Sample-Project \"Graphene-Sample-Project\"\n [84ed822d]: https://ludikha.github.io/Graphene-WebGL-Demo/ \"Graphene-WebGL-Demo\"\n\n\n## Online Demo\n### [Check out the WebGL demo ][f45eaa31]\n\n [f45eaa31]: https://ludikha.github.io/Graphene-WebGL-Demo/ \"Graphene WebGL demo\"\n\n\n## Installation\n### Using Unity Package Manager (For Unity 2018.3 or later)\n\n\n You can install the package via UPM by adding the line below to your project's `Packages/manifest.json` file.\n\n \n\n >You can find this file by opening your project's *Packages* folder in a file browser, it is not displayed in the editor.\n\n\n\n```\n{\n \"dependencies\": {\n \"com.graphene.core\": \"https://github.com/LudiKha/Graphene.git?path=/src\",\n \"com.graphene.components\": \"https://github.com/LudiKha/Graphene-Components.git?path=/src\",\n ...\n },\n}\n```\n\n>Do note that although both components and demo are optional packages, it is recommended you use them to kickstart your own Graphene-based development environment.\n\n#### Staying updated\nUpdating the package can be done via `Window/Graphene/Check for updates`. Unity currently does not support updating Git packages via the Package Manager automatically.\n\n\n### Using UPM Git Extension\nThe best way to install Graphene and stay up to date with the latest versions, is to use [UPM Git Extension][49fed258].\n 1. Follow the [installation instructions][2ddc031d]\n 2. In the Package Manager, click the  button, and add `https://github.com/LudiKha/Graphene.git` under subdirectory `src`, with the latest version.\n 3. Voilá! As an added bonus you are now able to update the package via the package manager.\n\n [49fed258]: https://github.com/mob-sakai/UpmGitExtension \"Upm Git Extension\"\n [2ddc031d]: https://github.com/mob-sakai/UpmGitExtension#installation \"UP Git Extension Installation Instructions\"\n\n\n \n\n---\n\n \n\n# Quickstart\n\nFor a quick start, Graphene comes with a component library and [sample project][52a86b14] - it is **highly** recommended to start your new project using the demo scene and resources provided within this project.\n\n [52a86b14]: https://github.com/LudiKha/Graphene-Sample-Project \"Graphene Sample Project\"\n\n#### 1: Constructing the hierarchy\n- Construct the high-level UI hierarchy, where each unique state is represented by a GameObject\n- Add a [`Plate`][0fb2479e] component to each GameObject in the tree, with a `Graphene` component at the root.\n- For each Plate in the tree, assign a static asset to its UIDocument. Root states will typically need a Layout-style [`template`](https://github.com/LudiKha/Graphene#template) for their children to be fitted in.\n\nPress play - Graphene will now dynamically construct the VisualTree based on your GameObject hierarchy. You've completed the required part of Graphene - however, we are still getting started.\n\nLet's draw and bind some data onto our UI.\n\n#### 2: Rendering & binding a model\n- Add a [`Theme`][a617f693] to the root Graphene component.\n- Add one or more [`Renderer`][b39c255d] components to each `Plate` that has dynamic (instantiated) content\n- Assign a [`Model`][19f2ae47] to the Renderer - this is a data container that serves as the model for the data-binding.\n- In the type(s) assigned as model, select the members you wish to expose for binding by adding [`BindAttribute`][b3387189]s. Add an additional `DrawAttribute` to dynamically instantiate controls in runtime using [`Templates`][fe269940].\n\n [a617f693]: https://github.com/LudiKha/Graphene#theming \"Theming\"\n\nPress play - Graphene will draw templates, and bind them to the model. If a static asset contained a control with a binding-path (e.g. a label with [`Model.Title`][04efb446]), this will be bound to the model too.\n\n [04efb446]: https://github.com/LudiKha/Graphene#scopes \"Scopes\"\n\nThe hierarchy is created and detail fields are rendered dynamically - now all that remains is to switch states.\n\n#### 3: Routing\n- Add a [`StringRouter`][1015cb88] to the root GameObject.\n- Add a `StringStateHandle` to each `Plate` GameObject that needs to be activated or deactivated based on states. Children are automatically deactivated with their parents. Give the StateHandle `StateId` unique names (e.g. \"start\", \"load\", \"exit\").\n- For each `Plate` that has one or more children using states, select which child state is enabled by default by ticking `enableWithParent`\n- In order to navigate, we can instantiate controls with a `RouteAttribute` or statically type them in UXML. Make sure to set the route member to a value that corresponds the available states.\n\n\n> Note: It is also possible to encapsulate a button within a Route element.\n> ```html\n>\n> \n>\n>\n>\n>```\n\n\nPress play - The router constructs its state tree from the `Plate` hierarchy. When clicking a route element (or child button), the router will attempt to change states and the view will display this state change accordingly.\n\n [0fb2479e]: https://github.com/LudiKha/Graphene#plates \"Plates\"\n [b39c255d]: https://github.com/LudiKha/Graphene#rendering \"Renderer\"\n [19f2ae47]: https://github.com/LudiKha/Graphene#model \"Model\"\n [1015cb88]: https://github.com/LudiKha/Graphene#routing \"Router\"\n [b3387189]: https://github.com/LudiKha/Graphene#binding \"Binding\" \n [fe269940]: https://github.com/LudiKha/Graphene#templating \"Templating\"\n\nCongrats! You're now done with the Quickstart and ready to tackle your first project using Graphene.\n\n \n\n---\n\n \n\n# Core Concepts\n\nGraphene decouples fine-grained authoring from high-level logic, and in doing so aims to leverage UI Toolkit's innovations to the fullest.\n\n## Plates\nA `Plate` represents a view controller in the VisualTree, and is used by Graphene to display the hierarchy, its states and views.\n\nA Graphene hierarchy consists of nested components called `Plates`, with a `Graphene` component at the root. `Plate`s are the core of Graphene, are analogous for a general-purpose UI controller that can be switched on or off. Other, optional MonoBehaviour components may hook into a plate, and have their functionality based on whether a plate is active or not.\n\nThe following components and logic depends on plates:\n- View\n\nThese can be authored in the familiar GameObject hierarchy. Graphene then constructs the VisualElement tree at runtime into a nested view.\n\n## Views\nA `View` represents a section of the screen, and is defined as a VisualElement within the `Plate`'s UXML asset. It contains an 'id', which serves as a unique identifier within the plate. Examples of views include a sidebar, a content area, a header or footer.\n\nViews can be used to compose static content (i.e. child Plates composing into parent Views), or to render dynamic content into (i.e. a renderer drawing a list of items into a View).\n\nBy default, Graphene components assume these two types of views will be present on a `Plate`:\n- **Content View**: A view that is used to render dynamic content into, using a `Renderer` component.\n- **Children View**: A view that is used to compose child plates into, based on the GameObject hierarchy.\n\n## Rendering & Binding\nRendering refers to the process of drawing and binding a model to the view. This is done using a `Renderer` component. It requires a `Model` to be assigned, which serves as the data container for the binding.\n\nIt consists of two passes:\n1. A static binding pass, where elements that are part of the static UXML asset assigned to the `Plate`'s `VisualTreeAsset` are bound to the model.\n2. A dynamic rendering and binding pass, where templates are rendered and bound from the model.\n\nA manager class called `Binder` takes care of the binding process and lifecycle management, and supports one-way and two-way binding modes.\n\n## Model\nA `Model` is a data container that serves as the model for the data-binding. Any class or struct can be used as a model, as long as it has been decorated with the `[Bind]` attribute on the members you wish to expose for binding.\n\n## Templating\nTemplating refers to the process of dynamically instantiating static UXML assets at runtime, based on a predetermined type of `Control` (i.e. a button, a toggle, a slider etc). UXML templates are mapped to a `ControlType` enum in a `TemplateAsset`, and DrawAttributes are used to instruct the `Renderer` which templates to instantiate.\n\n### Template\nA `Template` is a semantic name for static asset that represents a chunk of UXML of varying granularity and complexity, which are used as building blocks to build and render the application. Moreover, templates can be declared directly in UXML based, and will be rendered at runtime based on the `Renderer` template configuration. Templates are wrapped in a `TemplateAsset` ScriptableObject, where additional variants can be created without needing to create and maintain copies of the base template.\n\n#### Why use templates\n\nWhen creating a simple element, such as a button, it may quickly end up consisting of several carefully configured elements and bindings:\n\n```html\n\n \n \n \n \n \n \n \n\n```\n\nMaintaining multiple versions and instances of the same chunk of UXML throughout multiple files can be both error prone and time intensive. Graphene allows you to reuse the same template, and instantiate them at runtime when required.\n\n#### Creating a template\n\nCreate a `TemplateAsset` via the following menu command:\n> `Assets/Create/Graphene/Templating/TemplateAsset`\n\nAssign a static UXML template, and give it an appropriate name.\n\n#### Instantiating a template via CSharp\nTemplates can be instantiated directly in C# via a reference of the `TemplateAsset`.\n```csharp\nvar clone = myTemplateAsset.Instantiate();\n...\n\n```\n#### Instantiating a template via UXML\n Graphene allows you to statically type control types using the following syntax:\n\n```html\n\n```\nAt runtime, the button will be rendered to the full syntax of the first snippet, using the `Template` configuration of the `Renderer` component that initiates the binding.\n\n## Binding\n\n### Binding Modes\nGraphene supports 3 modes of binding a model to the view. These can either be specified in the BindAttribute on the model, or using the Binder API directly.\n- **OneTime**: Instructs the `Binder` to only \"print\" the model once onto the view. No continuous binding will be attempted. Useful for immutable data, such as titles, labels or button callbacks.\n>Note: Prefixing the binding-path with the `::` syntax instructs the binder to use a one-time binding.\n>```html\n>\n>```\n\n- **OneWay**: Creates a continuous binding from the model to the view. Updates are polled continuously but only for bindings that are currently visible (based on `Plate` state). Polling rate can be configured in the `Graphene` component.\n- **TwoWay**: Creates a two-directional binding (from model to view, and view to model) for controls that support two-way binding. View to model binding is based on `INotifyPropertyChange` callbacks.\n\n### Scopes\n- Scope drilldown `.` `Renderer.Model.ChildObject.Title`\n- Scope transferral `~` `~Renderer.Model` > `ChildObject.Title`\n\n### Binding Passes\n1. Static\n2. Dynamic\n\n### Static Binding\nStatic binding refers to binding elements that are part of the static UXML asset assigned to the `Plate`'s `VisualTreeAsset`. It allows you to bind elements that are always present in the view, such as titles, labels, buttons or other controls that may have a binding-path assigned. \n\nCommon use-cases include binding a title label to `Model.Title`, or binding a button's `Route` to a member in the model.\n\n### Dynamic Binding\nDynamic binding refers to binding elements that have been instantiated dynamically via the `Renderer`'s `Template` configuration, or viewmodel's `Instantiate` method. \n\nCommon use-cases include rendering a list of items from a collection, or rendering detail fields from a complex object, such as a Settings ScriptableObject.\n\n## Routing\nGraphene supports url-like state routing via the `Router` component. This allows you to construct a state hierarchy using the GameObject hierarchy, and navigate between states using `Route` elements.\n\nThe routing system is inspired by web standards, and mimics url-based addresses: `index/settings/video`. \n\n## Localization\nTBD\n\n## Step-by-step process\n1. Static view composition\n2. Static binding pass\n3. Render templates from dynamic model\n4. Dynamic binding pass\n5. Runtime one-way/two-way binding\n\n\n \n\n---\n\n \n\n# Inspector Extensions\nGraphene supports two third party inspector extensions out of the box: [Sirenix Odin Inspector][5855fee6] (paid) and [NaughtyAttributes][06602d8c] (free). Graphene relies on these to expose optional enhanced functionality to the inspector windows.\n\n[5855fee6]: https://odininspector.com/ \"Sirenix Odin Inspector\"\n[06602d8c]: https://github.com/dbrizov/NaughtyAttributes \"Naughty Attributes\"\n\n## Installation\n### Odin Inspector\nThis asset is automatically setup when it is included in the project.\n > Define symbol: `ODIN_INSPECTOR`\n\n### Naughty Attributes\nThis package requires you to follow the following steps:\n1. Add the package to the project `Packages/manifest.json` file:\n\n >`\"com.dbrizov.naughtyattributes\": \"https://github.com/dbrizov/NaughtyAttributes.git#upm\"`\n2. In Project Settings/Player/Scripting define symbols, add the following entry: `NAUGHTY_ATTRIBUTES;`\n\nAfter recompilation, your project will now have enhanced inspector functionality for Graphene components.\n"
},
{
"path": "docs/About.md",
"content": "layout: page\ntitle: \"About Graphene\"\npermalink: /about/\n\n\n\n# Graphene\n## UI Framework for unity\n\n## WebGL Demo\n"
},
{
"path": "docs/_config.yml",
"content": "theme: jekyll-theme-cayman"
},
{
"path": "docs/howto.md",
"content": ""
},
{
"path": "src/Core/Binding/Binder.cs",
"content": "using System;\nusing System.Collections.Generic;\nusing UnityEngine;\nusing UnityEngine.UIElements;\n\nnamespace Graphene\n{\n using Elements;\n using global::Graphene.ViewModel;\n using Kinstrife.Core.ReflectionHelpers;\n using System.Collections;\n using System.Linq;\n\n public interface IRoute\n {\n }\n\n /// \n /// Utility class to bind bindable data objects to VisualElements, using the to match members to s.\n /// \n /// Common use cases include buttons, labels, toggles, sliders etc. Supports recursive binding and drilling down into sub-scopes defined in UXML.\n public static class Binder\n {\n\tinternal static VisualElement InternalInstantiate(VisualTreeAsset template, Plate plate)\n\t{\n\t var clone = template.Instantiate();\n\t return clone.Children().First();\n\t}\n\n\t/// \n\t/// Binds the tree recursively\n\t/// \n\t/// \n\t/// \n\t/// \n\tpublic static VisualElement Instantiate(in object context, VisualTreeAsset template, Plate plate)\n\t{\n\t var clone = InternalInstantiate(template, plate);\n\t var t = context.GetType();\n\t if (RenderUtils.IsPrimitiveContext(t))\n\t {\n\t }\n\t // Bind class with its own context\n\t else\n\t {\n\t\tif (context is ICustomAddClasses customAddClasses)\n\t\t clone.AddMultipleToClassList(customAddClasses.ClassesToAdd);\n\t\tif (context is ICustomName customName && !string.IsNullOrWhiteSpace(customName.CustomName))\n\t\t clone.name = customName.CustomName;\n\n\t\t// Get members\n\t\tList> members = new List>();\n\t\tTypeInfoCache.GetMemberValuesWithAttribute(context, members);\n\t\tBinder.BindRecursive(clone, context, members, plate, false);\n\t }\n\t return clone;\n\t}\n\n\t/// \n\t/// Binds the tree recursively\n\t/// \n\t/// \n\t/// \n\t/// \n\tpublic static VisualElement InstantiatePrimitive(in object context, ref ValueWithAttribute bindableMember, VisualTreeAsset template, Plate plate)\n\t{\n\t var clone = InternalInstantiate(template, plate);\n\n\t if (bindableMember.Attribute == null)\n\t {\n\t\tDebug.LogError($\"Drawing {template.name} for primitive on {context} without Bind Attribute\", template);\n\t\treturn clone;\n\t }\n\n\t // Get members\n\t List> members = new List>();\n\t members.Add(bindableMember);\n\n\t // Bind without scope drilldown\n\t Binder.BindRecursive(clone, context, members, plate, false);\n\n\t return clone;\n\t}\n\n\t/// \n\t/// Binds the tree recursively\n\t/// \n\t/// \n\t/// \n\t/// \n\tpublic static void BindRecursive(VisualElement element, object context, List> members, Plate plate, bool notFullyDrilledDown)\n\t{\n\t if (members == null)\n\t {\n\t\t// Get members\n\t\tmembers = new List>();\n\t\tTypeInfoCache.GetMemberValuesWithAttribute(context, members);\n\t }\n\n\t // Is bindable with binding-path in uxml\n\t if (element is BindableElement el && !string.IsNullOrWhiteSpace(el.bindingPath))\n\t {\n\t\t// Should drill down to a child's scope (based on binding-path '.', and scope ovveride '~')\n\t\tbool branched = notFullyDrilledDown && TryBranch(el, context, plate);\n\t\tif (branched) // Started branch via drilled down scope branch\n\t\t return;\n\n\t\tBindElementValues(el, ref context, members, plate);\n\n\t\t// Context potentially has routing binding (TODO remove interface check)\n\t\tif (context is IRoute && plate.Router)\n\t\t plate.Router.BindRouteToContext(el, context);\n\t }\n\t // Image (not bindable)\n\t else if (element is Image image)\n\t {\n\t\tBindImage(image, ref context, members, plate);\n\t }\n\t // Rout el special case\n\t else if (element is Route route)\n\t {\n\t\tBindRoute(route, ref context, plate);\n\t }\n\n\t BindChildren(element, context, members, plate, notFullyDrilledDown);\n\t}\n\n\tstatic void BindChildren(VisualElement element, object context, List> members, Plate plate, bool scopeDrillDown)\n\t{\n\t //element.BindValues(data);\n\t if (element.childCount == 0)\n\t {\n\t\treturn;\n\t }\n\n\t // Loop through children and bind data to them\n\t foreach (var child in element.Children())\n\t {\n\t\tBindRecursive(child, context, members, plate, scopeDrillDown);\n\t }\n\t}\n\n\t/// \n\t/// Binds values of a particular VisualElement to an IBindable\n\t/// \n\t/// \n\t/// \n\t/// \n\tprivate static void BindElementValues(V el, ref object context, List> members, Plate plate) where V : BindableElement\n\t{\n\t if (el.binding != null/* || el.userData != null*/)\n\t {\n\t\tDebug.LogError($\"Binding twice! {el}\");\n\t\treturn;\n\t }\n\t else\n\t {\n\t\tel.userData = context;\n\t\tplate.Graphene.BroadcastBindCallback(el, context, plate);\n\t }\n\n\t // Pass in list of properties for possible custom logic spanning multiple properties\n\t if (el is Label)\n\t\tBindLabel(el as Label, ref context, members, plate);\n\t else if (el is Button)\n\t\tBindButton(el as Button, ref context, members, plate);\n\t else if (el is If)\n\t\tBindIf(el as If, ref context, members, plate);\n\t else if (el is Image image)\n\t\tBindImage(image, ref context, members, plate);\n\t else if (el is CycleField)\n\t\tBindCycleField(el as CycleField, ref context, members, plate);\n\t else if (el is DropdownField)\n\t\tBindDropdownField(el as DropdownField, ref context, members, plate);\n\t else if (el is ListView)\n\t\tBindListView(el as ListView, ref context, members, plate);\n\t else if (el is SelectField)\n\t\tBindSelectField(el as SelectField, ref context, members, plate);\n\t else if (el is Toggle)\n\t\tBindBaseField(el as Toggle, ref context, members, plate);\n\t else if (el is Slider)\n\t\tBindSlider(el as Slider, ref context, members, plate);\n\t else if (el is SliderInt sliderInt)\n\t\tBindSlider(sliderInt, ref context, members, plate);\n\t else if (el is MinMaxSlider minMax)\n\t\tBindMinMaxSlider(minMax, ref context, members, plate);\n\t else if (el is AbstractProgressBar progress)\n\t\tBindProgress(progress, ref context, members, plate);\n\t else if (el is Foldout foldout)\n\t\tBindFoldout(foldout, ref context, members, plate);\n\t else if (el is ButtonGroup buttonGroup)\n\t\tBindButtonGroup(buttonGroup, ref context, members, plate);\n\t else if (el is TextField)\n\t\tBindTextField(el as TextField, ref context, members, plate);\n\t else if (el is TextElement)\n\t\tBindTextElement(el as TextElement, ref context, members, plate);\n\t}\n\n\tprivate static void BindTextElement(TextElement el, ref object context, List> members, Plate plate)\n\t{\n\t foreach (var item in members)\n\t {\n\t\tif (BindingPathOrTypeMatch(el, in item))\n\t\t{\n\t\t BindText(el, ref context, in item, plate);\n\t\t break;\n\t\t}\n\t }\n\t}\n\tprivate static void BindLabel(Label el, ref object context, List> members, Plate plate)\n\t{\n\t foreach (var item in members)\n\t {\n\t\tif (BindingPathOrTypeMatch(el, in item))\n\t\t{\n\t\t BindText(el, ref context, in item, plate);\n\t\t break;\n\t\t}\n\t }\n\t}\n\n\n\tprivate static void BindButton(Button el, ref object context, List> members, Plate plate)\n\t{\n\t foreach (var item in members)\n\t {\n\t\tif (BindingPathAndTypeMatch(el, in item))\n\t\t{\n\t\t //Debug.Log($\"Binding BindableObject click {el.bindingPath} {context}\", context as UnityEngine.Object);\n\n\t\t //var data = item.Value as BindableObject;\n\t\t BindRecursive(el, item.Value, null, plate, false);\n\t\t var bindable = (BindableObject)item.Value;\n\t\t el.tooltip = bindable.Tooltip;\n\t\t BindCallbacks(el, context);\n\t\t //Debug.Log(bindable);\n\t\t break;\n\t\t}\n\t\telse if (BindingPathAndTypeMatch(el, in item))\n\t\t{\n\t\t //Debug.Log($\"Binding ActionButton click {el.bindingPath} {context}\", context as UnityEngine.Object);\n\t\t BindRecursive(el, item.Value, null, plate, false);\n\t\t el.tooltip = ((ActionButton)item.Value).Tooltip;\n\t\t break;\n\t\t}\n\t\telse if (BindingPathAndTypeMatch(el, in item))\n\t\t{\n\t\t //Debug.Log($\"Binding string click {el.bindingPath} {item.Value} {context}\", context as UnityEngine.Object);\n\t\t BindText(el, ref context, in item, plate);\n\t\t //break;\n\t\t}\n\t\telse if (BindingPathOrTypeMatch(el, in item))\n\t\t{\n\t\t //Debug.Log($\"Binding click {el.GetType().Name} {el.bindingPath} ({item.MemberInfo.Name} {item.Type.Name} in {context})\", context as UnityEngine.Object);\n\t\t BindClick(el, (Action)item.Value, context, plate);\n\t\t break;\n\t\t}\n\t\telse if (BindingPathOrTypeMatch(el, in item))\n\t\t{\n\t\t //Debug.Log($\"Binding UnityEvent click {el.GetType().Name} {el.bindingPath} ({item.MemberInfo.Name} {item.Type.Name} in {context})\", context as UnityEngine.Object);\n\t\t BindClick(el, (UnityEngine.Events.UnityEvent)item.Value, context, plate);\n\t\t break;\n\t\t}\n\t }\n\t}\n\n\tinternal static void BindRoute(Route el, ref object context, Plate plate)\n\t{\n\t // Check if parent is a button -> propagate click\n\t if (el.parent is Button button)\n\t {\n\t\tBindClick(button, el.clicked, context, plate);\n\t }\n\t else\n\t {\n\t\tforeach (var item in el.Children())\n\t\t{\n\t\t if (item is Button btn)\n\t\t {\n\t\t\tBindClick(btn, el.clicked, context, plate);\n\t\t }\n\t\t else if (item is ButtonGroup btnGroup)\n\t\t {\n\t\t\tbtnGroup.clicked += (int index, string route) => { el.route = route; el.clicked?.Invoke(); }; // A bit hacky perhaps\n\t\t }\n\t\t}\n\t }\n\n\t el.SetRouter(plate.Router);\n\n\t // Let the (generic) router handle the way it binds routes\n\t plate.Router.BindRoute(el, context);\n\t}\n\n\tprivate static void BindSlider(Slider el, ref object context, List> members, Plate plate)\n\t{\n\t el.Q(\"unity-dragger\").pickingMode = PickingMode.Ignore;\n\n\t // Slider specifics\n\t foreach (var item in members)\n\t {\n\t\t// Primary\n\t\tif (BindingPathOrTypeMatch(el, in item))\n\t\t{\n\t\t if (item.Attribute is BindFloatAttribute floatAttribute)\n\t\t {\n\t\t\tel.value = floatAttribute.startingValue;\n\t\t\tel.lowValue = floatAttribute.lowValue;\n\t\t\tel.highValue = floatAttribute.highValue;\n\t\t\tel.showInputField = floatAttribute.showInputField;\n\t\t\tbreak;\n\t\t }\n\t\t}\n\t\telse if (BindingPathAndTypeMatch(\"Min\", item))\n\t\t el.lowValue = (float)item.Value;\n\t\telse if (BindingPathAndTypeMatch(\"Max\", item))\n\t\t el.highValue = (float)item.Value;\n\t }\n\n\t // Bind base field value & callback\n\t BindBaseField(el, ref context, members, plate);\n\t}\n\n\tprivate static void BindSlider(SliderInt el, ref object context, List> members, Plate plate)\n\t{\n\t el.Q(\"unity-dragger\").pickingMode = PickingMode.Ignore;\n\n\t // Slider specifics\n\t foreach (var item in members)\n\t {\n\t\t// Primary\n\t\tif (BindingPathOrTypeMatch(el, item))\n\t\t{\n\t\t if (item.Attribute is BindIntAttribute att)\n\t\t {\n\t\t\tel.value = att.startingValue;\n\t\t\tel.lowValue = att.lowValue;\n\t\t\tel.highValue = att.highValue;\n\t\t\tel.showInputField = att.showInputField;\n\t\t\tbreak;\n\t\t }\n\t\t}\n\t\telse if (BindingPathAndTypeMatch(\"Min\", item))\n\t\t el.lowValue = (int)item.Value;\n\t\telse if (BindingPathAndTypeMatch(\"Max\", item))\n\t\t el.highValue = (int)item.Value;\n\t }\n\n\t //el./*showMixedValue*/ = true;\n\t //el.showInputField = true;\n\n\t // Bind base field value & callback\n\t BindBaseField(el, ref context, members, plate);\n\t}\n\n\tprivate static void BindMinMaxSlider(MinMaxSlider el, ref object context, List> members, Plate plate)\n\t{\n\t el.Q(\"unity-dragger\").pickingMode = PickingMode.Ignore;\n\t // Slider specifics\n\t foreach (var item in members)\n\t {\n\t\t// Primary\n\t\tif (BindingPathOrTypeMatch(el, in item))\n\t\t{\n\t\t if (item.Attribute is BindRangeAttribute floatAttribute)\n\t\t {\n\t\t\tel.value = floatAttribute.startingValue;\n\t\t\tel.lowLimit = floatAttribute.lowLimit;\n\t\t\tel.highLimit = floatAttribute.highLimit;\n\t\t\tbreak;\n\t\t }\n\t\t}\n\t\telse if (BindingPathAndTypeMatch(\"Min\", item))\n\t\t el.lowLimit = (float)item.Value;\n\t\telse if (BindingPathAndTypeMatch(\"Max\", item))\n\t\t el.highLimit = (float)item.Value;\n\t }\n\n\t // Bind base field value & callback\n\t BindBaseField(el, ref context, members, plate);\n\t}\n\n\tprivate static void BindProgress(AbstractProgressBar el, ref object context, List> members, Plate plate)\n\t{\n\t // Progress Bar specifics\n\t foreach (var item in members)\n\t {\n\t\t// Primary\n\t\tif (BindingPathOrTypeMatch(el, item))\n\t\t{\n\t\t if (item.Attribute is BindFloatAttribute att)\n\t\t {\n\t\t\tel.value = att.startingValue;\n\t\t\tel.lowValue = att.lowValue;\n\t\t\tel.highValue = att.highValue;\n\t\t\tbreak;\n\t\t }\n\t\t}\n\t\telse if (BindingPathAndTypeMatch(\"Min\", item))\n\t\t el.lowValue = (float)item.Value;\n\t\telse if (BindingPathAndTypeMatch(\"Max\", item))\n\t\t el.highValue = (float)item.Value;\n\t }\n\t var results = BindNotifyValueChange(el, ref context, members, plate);\n\t el.value = results.value;\n\t el.title = results.label;\n\t}\n\n\tprivate static void BindTextField(TextField el, ref object context, List> members, Plate plate)\n\t{\n\t foreach (var item in members)\n\t {\n\t\t// Primary\n\t\tif (BindingPathOrTypeMatch(el, in item))\n\t\t{\n\t\t if (item.Attribute is BindStringAttribute stringAttribute)\n\t\t {\n\t\t\tel.value = stringAttribute.startingValue;\n\t\t\tel.isPasswordField = stringAttribute.password;\n\t\t\tel.isReadOnly = stringAttribute.readOnly;\n\t\t\tel.multiline = stringAttribute.multiLine;\n\n\t\t\tif (stringAttribute.maxLength >= 0)\n\t\t\t el.maxLength = stringAttribute.maxLength;\n\t\t\tbreak;\n\t\t }\n\t\t}\n\t }\n\n\t BindBaseField(el, ref context, members, plate);\n\t}\n\n\tprivate static (TValueType value, string label) BindNotifyValueChange(TElementType el, ref object context, List> members, Plate plate) where TElementType : BindableElement, INotifyValueChanged\n\t{\n\t bool labelFromAttribute = false;\n\t string label = null;\n\t foreach (var item in members)\n\t {\n\t\t// Primary (value)\n\t\tif (BindingPathOrTypeMatch(el, in item))\n\t\t{\n\t\t if (item.Value is TValueType value)\n\t\t {\n\t\t\tel.SetValueWithoutNotify(value);\n\t\t\tplate.BindingsManager.TryCreate(el, in context, in item, plate);\n\t\t }\n\t\t else if (item.Value is BindableBaseField baseField)\n\t\t {\n\t\t\tel.SetValueWithoutNotify(baseField.value);\n\t\t\tif (!string.IsNullOrWhiteSpace(baseField.Label))\n\t\t\t label = baseField.Label;\n\t\t\tplate.BindingsManager.TryCreate(el, in item.Value, in item, plate);\n\t\t }\n\n\t\t // Set label from attribute\n\t\t if (item.Attribute is BindBaseFieldAttribute att)\n\t\t {\n\t\t\tif (!string.IsNullOrWhiteSpace(att.label))\n\t\t\t{\n\t\t\t //el.text = att.label;\n\t\t\t labelFromAttribute = true;\n\t\t\t label = att.label;\n\t\t\t}\n\t\t }\n\t\t}\n\t\t// Set register callback event\n\t\telse if (item.Attribute is BindValueChangeCallbackAttribute callbackAttribute)\n\t\t{\n\t\t var target = item.Value as EventCallback>;\n#if UNITY_ASSERTIONS\n\t\t UnityEngine.Assertions.Assert.IsNotNull(target, \"Bindable item Invalid callback - ValueType mismatch.\");\n#endif\n\t\t el.RegisterValueChangedCallback(target);\n\t\t}\n\t\t// Set label from field, if not from attribute\n\t\telse if (!labelFromAttribute && item.Attribute.Path == \"Label\" && item.Value is string labelText)\n\t\t label = labelText;\n\t\t//BindText(el.labelElement, ref context, labelText, in item, plate);\n\t\telse if (item.Attribute is BindTooltip)\n\t\t el.tooltip = ObjectToString(item.Value, item.Type);\n\t }\n\n\t // Returning value & label tuple because each element implements text differently. (E.g. Foldout vs. Basefield)\n\t return (el.value, label);\n\t}\n\n\tprivate static void BindBaseField(BaseField el, ref object context, List> members, Plate plate)\n\t{\n\t var results = BindNotifyValueChange, TValueType>(el, ref context, members, plate);\n\t el.label = results.label;\n\t}\n\n\tprivate static void BindDropdownField(DropdownField el, ref object context, List> members, Plate plate)\n\t{\n\t // Then bind the items\n\t foreach (var item in members)\n\t {\n\t\t// Model items\n\t\tif (BindingPathMatch(item.Attribute.Path, SelectField.itemsPath))\n\t\t{\n\t\t el.choices = item.Value as List;\n\t\t break;\n\t\t}\n\t\telse if (item.Type.IsEnum) // Primitive -> Can only do two way\n\t\t{\n\t\t el.choices = Enum.GetNames(item.Type).ToList();\n\t\t el.SetValueWithoutNotify(ObjectToString(item.Value, item.Type) ?? el.value);\n\n\t\t var t = item.Type;\n\t\t var memberName = item.MemberInfo.Name;\n\t\t var accessor = TypeInfoCache.GetExtendedTypeInfo(context.GetType()).Accessor;\n\t\t var ctx = context;\n\n\t\t // Filthy hax\n\t\t el.RegisterValueChangedCallback((evt) =>\n\t\t {\n\t\t\tvar val = Enum.Parse(t, evt.newValue);\n\t\t\taccessor[ctx, memberName] = val;\n\t\t });\n\t\t}\n\t }\n\n\t // First bind base field (string)\n\t BindBaseField(el, ref context, members, plate);\n\t}\n\n\tprivate static void BindSelectField(SelectField el, ref object context, List> members, Plate plate)\n\t{\n\t // Then bind the items\n\t foreach (var item in members)\n\t {\n\t\t// Model items\n\t\tif (BindingPathMatch(item.Attribute.Path, SelectField.itemsPath))\n\t\t{\n\t\t el.items = item.Value as List;\n\t\t break;\n\t\t}\n\t }\n\n\t // First bind base field (int)\n\t BindBaseField(el, ref context, members, plate);\n\t}\n\n\tprivate static void BindListView(ListView el, ref object context, List> members, Plate plate)\n\t{\n\t foreach (var bindMember in members)\n\t {\n\t\t// Primary\n\t\tif (BindingPathMatch(bindMember.Attribute.Path, el.bindingPath))\n\t\t{\n\t\t ControlType controlType = ControlType.ListItem;\n\t\t if (context is IListViewBindable listViewBindable)\n\t\t {\n\t\t\tcontrolType = listViewBindable.ItemControlType;\n\t\t }\n\n\t\t IList list = bindMember.Value as IList;\n\n\t\t RenderUtils.templatesDefault.TryGetTemplateAsset(controlType, out VisualTreeAsset template);\n\t\t InternalBindListView(el, in context, list, template, plate);\n\n\t\t plate.BindingsManager.TryCreate(el, in context, in bindMember, plate);\n\t\t break;\n\t\t}\n\t }\n\n\t // Fallback\n\t if (context is IListViewBindable listViewBindable2)\n\t {\n\t\tRenderUtils.templatesDefault.TryGetTemplateAsset(listViewBindable2.ItemControlType, out VisualTreeAsset template);\n\t\tInternalBindListView(el, in context, listViewBindable2.ItemsSource, template, plate);\n\t }\n\t}\n\n\tinternal static void BindListView(ListView el, in object context, Plate plate, VisualTreeAsset templateAsset, in ValueWithAttribute member)\n\t{\n\t IList list = member.Value as IList;\n\t InternalBindListView(el, in context, list, templateAsset, plate);\n\t plate.BindingsManager.TryCreate(el, in context, in member, plate);\n\t}\n\n\n\tinternal static void InternalBindListView(ListView el, in object context, IList itemsSource, VisualTreeAsset templateAsset, Plate plate)\n\t{\n\t bool elementsPickable = true;\n\n\t if (context is IListViewBindable bindable)\n\t {\n\t\tbindable.Apply(el);\n\t\tBindCallbacks(el, context);\n\t\telementsPickable = bindable.ElementsPickable;\n\t }\n\n\t Func makeItem = () =>\n\t {\n\t\tvar e = InternalInstantiate(templateAsset, plate);\n\t\te.pickingMode = elementsPickable ? PickingMode.Position : PickingMode.Ignore;\n\t\treturn e;\n\t };\n\t Action bindItem = (e, i) =>\n\t {\n\t\tvar src = itemsSource[i];\n\t\te.userData = src;\n\t\tBinder.BindRecursive(e, src, null, plate, false);\n\t\tif (!(e is BindableElement))\n\t\t{\n\t\t BindCallbacks(e, src);\n\t\t}\n\t };\n\n\t el.makeItem = makeItem;\n\t el.bindItem = bindItem;\n\t el.itemsSource = itemsSource;\n\t}\n\n\tprivate static void BindCycleField(CycleField el, ref object context, List> members, Plate plate)\n\t{\n\t // Then bind the items\n\t foreach (var item in members)\n\t {\n\t\t// Model items\n\t\tif (BindingPathMatch(item.Attribute.Path, CycleField.itemsPath))\n\t\t{\n\t\t el.items = item.Value as List;\n\t\t break;\n\t\t}\n\t }\n\n\t // First bind base field (int)\n\t BindBaseField(el, ref context, members, plate);\n\t}\n\n\tprivate static void BindIf(If el, ref object context, List> members, Plate plate)\n\t{\n\t // Then bind the items\n\t foreach (var item in members)\n\t {\n\t\t// Model items\n\t\tif (BindingPathMatch(el, in item))\n\t\t{\n\t\t plate.BindingsManager.TryCreate
![](\"https://raw.githubusercontent.com/LudiKha/Graphene/master/docs/images/graphene-logo-full.png\"){kind=logo}
\n