Wallet UI
As a Wallet as a Service product, this SDK requires no UI. However, as we expect some apps will still choose to provide some form of wallet UI to users, we are making efforts to provide a default UI for you to use.
This UI can be found under SequenceFrontend
.
To add the UI to your scene, you can add the WalletPanel
prefab found under SequenceFrontend > Prefabs
. It is opened using the Open method; you must provide an Sequence.EmbeddedWallet.IWallet
(e.g. a SequenceWallet
) as an argument.
You'll notice that the UI is still a work in progress and is also using mocks in some places (fetching transaction history and prices). These will be replaced in coming updates of the SDK, but please feel free to replace them on your own (and for bonus points, submit a PR!).
How It Works
The sample Sequence UI is comprised of a few important components.
UIPage
A UIPage
is the base implementation of a "page" in the sample UI. Example pages: LoginPage
, TokenInfoPage
It is responsible for opening/closing the page and managing the chosen ITween
.
ITween
An ITween
is an interface for an animation (in/out) that can be applied to a RectTransform
(a required component of a UIPage
). If you don't like the animations for a given UIPage
or UIPanel
you can easily swap it for any other MonoBehaviour implementing the ITween
interface, even your own!
Tip: to save time creating your own animations, consider using the popular DOTween toolset
UIPanel
Inherriting from UIPage
, a UIPanel
is the base implementation of a "panel" in the sample UI. Example panels: LoginPanel
, WalletPanel
In addition to UIPage
responsibilities, UIPanels maintain a stack of UIPages and object[]
(open arguments) and are responsible for managing any required event listeners and UI transitions between their child pages (according to Scene inspector heirarchy), including handling the "Back" button.
SequenceSampleUI
SequenceSampleUI
can be thought of as the "manager" of the sample UI. It holds a reference to all the UIPanels and is responsible for opening them as needed, including at Start()
. If you are integrating all or part of the provided sample UI into your project, you may find it more practical to replace SequenceSampleUI
with your own UI "manager", using SequenceSampleUI
as a reference.
UI Customizability
Built on Unity's UI system, the UI is entirely customizable. We encourage you to make it your own and "beautify" it to suit your app!
Color Scheme Manager
To help you with the process, we've added a basic ColorSchemeManager
script which you can experiment with in our Demo scene, which can be imported via Package Manager.
To use the ColorSchemeManager
, please perform the following in edit mode.
- Create a
Color Scheme
scriptable object by navigating to the top barAssets > Create > Sequence > Color Scheme
and give it an appropriate name. - Set the desired colors in your new scriptable object - don't forget to set the alpha values! Unity defaults these to 0.
- Locate the
ColorSchemeManager
MonoBehaviour in your scene in the inspector. In our demo scene, this is attached to theSequenceCanvas
gameObject. - Set your newly created scriptable object as the Color Scheme.
- Click "Apply". Note that this may take a few seconds to apply and you may need to click apply multiple times due to the way Unity refreshes after changes in the inspector (version dependant).
The ColorSchemeManager
isn't meant to give you perfect results and the perfect UI right out of the gate, but we hope it saves you some time on the way there!
More Customization Tools Coming Soon
We hope to bring you more convenience tools to help you customize the UI quicker and easier! While we have ideas of our own, nobody understands your needs better than you do, so please don't hesitate to reach out to us with any ideas you have! Or better yet, submit a PR!