rad href - shannah/CodeRAD GitHub Wiki
An attribute that can be added to any ActionSource component (e.g. <button>, <multiButton>, etc.) or EntityView which specifies a URI to navigate the app to when a designated event is fired on the component.
When added to an ActionSource component like <button> or <multiButton>, the link is triggered by an ActionEvent. When added to an EntityView, you must also add the rad-href-trigger attribute to specify the ActionNode.Category that should trigger the event.
<myComponent
rad-href="targetURI [context setting]"
rad-href-trigger="TRIGGER_CATEGORY" ...
/>Where:
- targetURI
-
The target URI of the link (i.e. where does the app navigate to as a result of clicking this link).
See URI Syntax.
- context setting
-
The navigation context setting for the link. Possible values include child, sibling, top, and _blank. Default value is child.
See Context Settings.
- TRIGGER_CATEGORY
-
Only for use in EntityViews. The Action category that should trigger the link.
The rad-href allows a few different URI types, and more formats may be added. Currently you can:
-
specify another RAD View to navigate to using
#ViewName, -
or you can specify web page to open (externally) using an
http://orhttps://URL. -
or you can specify a Java expression to execute using
java:….
When navigating to another view, you can specify the navigation context by appending a space, then one of the following context settings at the end of the rad-href attribute value:
- child
-
(Default) The target form controller will be a child of the current form controller. E.g. The form’s back button will return to this form.
- sibling
-
The target form controller will be a sibling of the current form controller. E.g. The form’s back button will navigate to the parent form of this form - or the same place that this form’s back button goes.
- top
-
The target form controller will be created as a top-level form. It’s direct parent will be the application controller. E.g. The form will not have a back button.
- _blank
-
Used only with
http://andhttps://URLs. This will cause the URL to open in the system’s web browser. I.e. it will leave the app. - sel:SELECTOR
-
SELECTOR is a query selector (similar to a CSS selector) that identifies a container within the existing form into which the target view should be loaded. See ComponentSelector for selector syntax.
- sheet
-
Loads the target view inside a Sheet. You can also use one of the variants of this:
sheet-top,sheet-left,sheet-right, orsheet-centerto specify where the sheet should be positioned.
<button rad-href="#BindingsPage">Bindings</button><?xml version="1.0"?>
<y xsi:noNamespaceSchemaLocation="SheetSample.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<title>Sheet Sample</title>
<button rad-href="#StartPage sheet">Open Sheet</button>
<button rad-href="#StartPage sheet-top">Open Sheet Top</button>
<button rad-href="#StartPage sheet-left">Open Sheet Left</button>
<button rad-href="#StartPage sheet-right">Open Sheet Right</button>
<button rad-href="#StartPage sheet-center">Open Sheet center</button>
</y>The following example creates a SplitPane, where the left side includes a menu of buttons. Clicking on any of the buttons will load a corresponding view in the right pane.
<?xml version="1.0"?>
<splitPane xsi:noNamespaceSchemaLocation="IFrameSample.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<title>IFrame Sample</title>
<y>
<button rad-href="#StartPage sel:#Center"
rad-transition="rad-href 1s flip">Start Page
</button>
<button rad-href="#BindingsPage sel:#Center"
rad-transition="rad-href 1s flip">Bindings Page (Flip)
</button>
<button rad-href="#BindingsPage sel:#Center"
rad-transition="rad-href 1s slide">Bindings Page (Slide)
</button>
<button rad-href="#BindingsPage sel:#Center"
rad-transition="rad-href 1s cover">Bindings Page (Cover)
</button>
<button rad-href="#BindingsPage sel:#Center"
rad-transition="rad-href 1s fade">Bindings Page (Fade)
</button>
<button rad-href="#BindingsPage sel:#Center"
rad-transition="rad-href 1s uncover">Bindings Page (Uncover)
</button>
<button rad-href="#IFrameSample sel:#Center"
rad-transition="rad-href 1s flip">IFrame Sample Page</button>
<button rad-href="#CustomViewControllerSample sel:#Center"
rad-transition="rad-href 1s flip">Custom View Controller
</button>
</y>
<border name="Center">
<label layout-constraint="center">Placeholder for content</label>
</border>
</splitPane>|
Note
|
This example also makes use of the rad-transition attribute to employ a nice transition when changing the view of the container. |
The active ingredient of this example is that the target context of each of the buttons is sel:#Center, which means that the target view should be loaded in a container with name="Center". This will target <border name="Center"> container.
<button rad-href="https://www.codenameone.com _blank">codenameone.com</button><button rad-href="#WelcomePage top">Welcome</button><button rad-href="#DetailsPage sibling">Details</button>See Controllers for more information about the controller hierarchy.
All views include a back() method that can be called to trigger a FormBackEvent, which will cause the user to navigate back to the previous form. We can trigger this in the rad-href attribute using the java: prefix as follows:
<button rad-href="java:back()">Go Back</button>