IBM Worklight 6.1 - Custom UI Pattern - ibm-mobilefirst

I'm trying out the mobile pattern, and have been trying to crate my own custom pattern that is now supposedly supported in Worklight 6.1.
When I tried creating jquery UI pattern, several issues:
1. The rich page editor for the pattern.html does not display the jquery component correctly on the design page (e.g button is displayed as link).
2. When I added a new page (into a jquery hybrid app) based on the custom UI pattern, it does not create a new page. It only adds the content code into the index.html, and I had to create the page myself.
Is this the correct behaviour?
I'm also having difficulty in creating Dojo UI pattern… as there is no Dojo component available on the palette when I open up the dojo > pattern.html file.
Do I have to add the libraries and code manually (i.e. no Drag-and-Drop)?
Appreciate any pointers on this.
PS: I'm using Eclipse Juno R2

1) For jQuery based patterns you need to append a jQuery core file to the project besides the jQuery mobile ones, for example, append this one: http://code.jquery.com/jquery-1.10.2.js to your project, next to jquery mobile JS file. This is just because "UI Pattern" projects don't have this file available, but they need it to handle a proper preview.
2) For Dojo patterns, there is still no official support (for example Drag and drop), so even you can modify pattern.html to get some "insertable" code, you may still need some additional tuning to get a valid pattern.

Related

Creating reusable child views in Titanium Alloy (A

I'm new to Appcelerator Titanium, so one of the considerations that popped into my mind was this: how do I create reusable custom controls for use in Alloy? Take for example in Android:
The ColorPicker is a 3rd-party library that allows me to add it as a control to the .xml file so long as I reference the library. I would also be able to create my own controls and either reuse them locally or distribute them as an external library. Is there a similar concept for Titanium, more specifically for Alloy (i.e. the xml and all)?
Yes there is the concept of creating widgets and which can be reused locally in the projects. There are alot of widgets already available.
One of the important widgets for creation of the application Font Awsome Widget.
You can see the source code as well and check its implementation.

Can a HTML/WinJS View use a user control built in XAML/C#?

I am hesitant to develop a Windows Phone app in the HTML/WinJS Universal App space because of the difficulty of building complex user controls. Before I go the XAML/C# route, I would like to find out if it is possible to use a user control built in XAML/C# inside of an HTML/WinJS view?
My initial feeling is that it is not possible due to XAML parsing not being available in the HTML space, but I am not certain that this is the case. Any thoughts?
Also, I am not interested in 3rd party solutions such as Xamerin. I am really trying to see if this is possible from a native approach.
No. The HTML and Xaml UI stacks in the Windows Runtime are separate and cannot be mixed. You can call non-UI C# or native Windows Runtime Components from JavaScript.
You can include HTML in a Xaml WebView, but there is no reverse hosting.
--Rob

How to get started with Infragistics web controls using MVC

I have an existing web project in Visual Studio 2012 and it is MVC4. I have Infragistics installed (all components) on the machine.
Now what I want to achieve is to be able to use the web drop down control via a HTML helper.
After some reading on here I understand there may be a few steps involved in order to be able to use the HTML helper as I wish, such as adding the namespace either to the web.config or the view.
I have tried to manually add references to the libraries but after, when trying to add the namespace to my view, it is not recognised. Assuming that there are DLL dependencies I am not aware of I used the Infragistics "Create ASP.NET Toolbox Tab for CLR 4.0 2013.1" app to hopefully add my controls for me so that a drag drop onto my html page would hopefully add whatever reference is required. The app seems to complete successfully but I don't see any change to what I need. No new items in the toolbox and still I cannot add the namespace to my view.
Can someone please tell me simply as possible how to get started? I cannot believe how difficult I have found this. I don't mind what technique, I just need a technique.
Thanks
Not a complete answer but one reason why I could not use it was because adding a reference is not enough. You need to set CopyLocal=true in order for the HtmlHelpers to pick it up.
Use the jQuery combo box rather than the ASP.NET WebDropDown as the WebDropDown is dependent on the page and ASP.NET web forms which you are not using in ASP.NET MVC. You can either write your own helper or use the one that Infragistics provides.

Standalone video control example for Google TV jQuery Library?

The jQuery VideoControl is documented here:
https://developers.google.com/tv/web/lib/jquery/#gtv.jq.VideoControl
It takes a set of VideoParms. That are not specified.
It is used in the sample templates on this page:
https://developers.google.com/tv/web/docs/gtv-templates
I've taken apart the templates, but I'm having difficulty creating a simple example of a standalone video control. In the templates, the sidenav and carousel code are tied to how the videocontrol works. There is a relationship between the keyController and behavior (behaviorZones) that I can not find an explanation for.
Is there a standalone example somewhere? What needs to be setup with keycontroller, css, and behavior to get this going?
I'm not aware that there is a standalone videocontrol.js sample but it should be possible to set it up. Most of the necessary pieces are inside videocontrol.js, in particular in the videocontrol's constructor and this function: gtv.jq.VideoControl.prototype.makeControl.
keycontroller mapping is used to handling key inputs and some of the CSS are dynamically controlled within JS so there might be errors if you just rip them apart straight from the Template. You'd have to debug it using a solid tool like Chrome Developer Tools. You can watch tutorials of this tool here: http://www.youtube.com/results?search_query=chrome+developer+tools&oq=chrome+develop&aq=0&aqi=g3g-m2&aql=&gs_sm=3&gs_upl=1972l4015l0l6142l14l11l0l0l0l0l207l1476l3.5.3l11l0
Otherwise please send your error traces and/or code snippet for debugging help.
S

Applying a Silverlight 4 Toolkit Theme to an Existing Business Application?

I have created a new Silverlight 4 solution using the Business Application template. The requirement is to style the application and not use the generic template theme. I have installed the Silverlight 4 toolkit and like the BureauBlue theme.
How do I apply the BureauBlue toolkit theme to the entire solution? That is, is there a way to apply the theme globally (similar to attaching a CSS file to an ASP.NET or HTML site) instead of applying the theme to each control?
Thanks,
Sid
I have not experimented with this using a site that runs off an application with many user controls, but this seemed to work for my entire application and may help you.
First you have to have the theme reference added (for example, System.Windows.Controls.Theming.BureauBlue.dll)
Then in your code you can add this line of code:
System.Windows.Controls.Theming.BureauBlueTheme.SetIsApplicationTheme(Application.Current, true);
This applies the theme to the current running application, and if the boolean value is false I believe it will remove the theme.