Giter VIP home page Giter VIP logo

unigame.viewsystem's Introduction

UniGame.ViewSystem

MVVM View System for Unity3D

Odin Inspector Asset recommended to usage with this Package (https://odininspector.com)

Overview

  • support base principles of MVVM concepts.
  • support ui skins out of the box
  • based on Unity Addressables Resources
  • handle Addressables Resource lifetime

Getting Started

Add to your project manifiest by path [%UnityProject%]/Packages/manifiest.json new Scope:

{
  "scopedRegistries": [
   {
      "name": "UniGame",
      "url": "http://packages.unigame.pro:4873/",
      "scopes": [
        "com.unigame"
      ]
    }
  ],
}

and now install via Package Manager

Getting Started

  • Create View System Asset

View System Settings

Create Settings

SetUp Views Locations

Here you can initialize locations of views

For skinned views. Skin name of view equal to it's parent folder. Your project views prefabs structure involve direct mapping into its skins

Addressable Support

For now All views load at runtime through Unity Addressable Asset system

By default if your views not registered as Addressable Asset when View System automatically register it into new Addressable Group With name equal to its ViewsSettings Source Name

You can enable Addressable Group Name override:

  • Enable "Apply Addressable Group" option
  • SetUp new views group name

Nested View Sources

View System Support additional "nested" view settings sources. All view from that sources will be registered into main View System when it loaded. All nested view settings loads async. If that't source must be loaded before the View System will be available its possible activate "Await Loading" option.

Layouts Control

"Layout Flow Control" asset control views behaviours between all layouts. View System support two flow behaviour out from the box.

  • DefaultFlow

Base flow controller with auto closing screens/windows when active scene changed

  • SingleViewFlow

More complex flow with support 'IScreenSuspendingWindow' api. If View with 'IScreenSuspendingWindow' is open, when all current screens wills suspend and resume after it closed.

Settings Rebuild

You can manualy trigger rebuild:

  • Rebuild Command

  • For All Settings

  • For target settings asset from inspector context menu

Skins Support

Different flavours of the same view type can be created by utilizing skins. When a skin tag is provided on view creation the corresponding skin is instantiated (if it's been registered prior to it). Skin tag can be provided as a string or a variable of SkinId type (which allows choosing one of the registered tags from a dropdown list and implicitly converts it to a string)

void ExampleFunc(SkinId largeDemoView) {
  await gameViewSystem.OpenWindow<DemoView>(ViewModel, "SmallDemoView");
  await gameViewSystem.OpenWindow<DemoView>(ViewModel, largeDemoView);
}

Skins via folders

Place views of the same type in separate folders and add them to the UI Views Skin Folders list in view system settings. After rebuilding the views will be added to the views registry with folder names as their skin tags

Skins via component

Add View Skin Component to a prefab to turn it into a skin. To add a new skin tag enter it into Skin Tag Name field and press Invoke, an existing tag can be chosen from the Skin Tag dropdown list. No need to specify skin folders in view system settings image image

Pooling Support

API References

Views & ViewModels

Reactive Binding

All base Bind extensions use ViewModelLifetime" thats allow auto disconnect from data streams when ViewModel changed

Binding extensions allow you easy connect you view and data sources with rich set flow syntax and support Rx method and async/await semantics

Bind To UGUI

Help methods to direct bind unity UGUI types to data streams

  • Button methods

Bind Button to model action

public Button openChest;

[Serializable]
public class WindowViewModel : ViewModelBase
{
    public ReactiveCommand checkAction = new ReactiveCommand();
    public IReactiveCommand<Unit> ChestAction => checkAction;
}

protected override UniTask OnViewInitialize(WindowViewModel model)
{
    this.Bind(openChest,model.ChestAction);
    
    return UniTask.CompletedTask;
}

Bind Model to Button invoke

public Button openChest;

[Serializable]
public class WindowViewModel : ViewModelBase
{
    public ReactiveCommand checkAction = new ReactiveCommand();
    public IReactiveCommand<Unit> ChestAction => checkAction;
}

protected override UniTask OnViewInitialize(WindowViewModel model)
{
    this.Bind(model.ChestAction,openChest);
    
    return UniTask.CompletedTask;
}
  • TextMeshPro methods
[Serializable]
public class WindowViewModel : ViewModelBase
{
    public ReactiveProperty<string> label = new ReactiveProperty<string>();
    public ReactiveProperty<string> value = new ReactiveProperty<string>();
    
    public IObservable<string> Label => label;
    public IObservable<string> Value => value;
}

public TextMeshProUGUI label;
public TextMeshProUGUI value;

protected override UniTask OnViewInitialize(WindowViewModel model)
{
    this.Bind(model.Label,label)
        .Bind(model.Value,value);
    
    return UniTask.CompletedTask;
}
  • Image methods

  • LocaliztionString methods

Behaviour bindings

Allow you call show/hide/close and another actions with when views/data streams events occurs

Examples

All examples can be found here:

https://github.com/UniGameTeam/UniGame.ViewSystem.Examples

Item List View

Localization View

Nested Views Sources

View Skin loading

License

MIT

unigame.viewsystem's People

Contributors

mefodei avatar mikhailovssergei avatar glongooo avatar mikhailovss avatar fedchenkoe 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.