I have a basic app I'm creating with a Top Nav button Bar a bottom button Bar and a Viewstack for content in the middle. The catch is the content, and skins are completely dynamic based on XML I'm loading. Therefore I have to create the ViewStack dynamically (because I don't know how many children it could have) and the same goes for the top and bottom Nav button bars. Now, I could handle this very neatly with Flex 3 , however I want to to do this with Flex 4 and would like to take advantage of its new logic and skinning separation architecture. I have seen many tutorials on this as far as components known at compile time but not for custom class creation. Can anyone list some good tutorials? thx - Mike
I could not find any tutorials , so I figured I would create my components dynamically as I would in Flex 3, the only difference would be that if I have a component I need to skin, in my case a button, and I'm creating it dynamically I would use :
btn_nav.setStyle("skinClass",skins.NavMainToggleButtonSkin);
Where the host component is : [HostComponent("spark.components.ToggleButton")]
I also am using custom Spark Viewstack that a developer wrote:
spark Viewstack
Also this article helped me with creating a custom component and connecting wih a skin class and how it relates to the component lifecycle:
http://flexguruin.wordpress.com/2010/12/08/flex-4-spark-component-life-cycle/
-Mike
Related
I found this card component example on the internet and would like to build something similar with Vuetify. I'd like to know what is the best/easiest way to approach this? Using default v-card and add custom elements/css inside.Or building the whole card with Vuetify gid?
You can recreate something similar with an outlined v-card with only a v-card-text child. The top section looks like an outlined v-alert with left border. Use v-row and v-col (col-auto on all) grid inside, with v-spacer for the whitespace after first column. Bottom section will also have the grid. You could also put the v-alert inside v-card-title for similar effect but I don't think the banner alert is appropriate as a "card title".
Vuetify is a Vue UI library that provides ready-to-use components saving the developer time. So if the components Vuetify makes available to you are fine out of the box, you're fine, otherwise there's nothing wrong with adding custom CSS. In reference to the screenshot you attached, vuetify allows you to make that card in a practically identical way. In addition to studying the functioning of the basic components, I recommend that you take a look at the ready-made CSS classes that Vuetify provides you. Thanks to those you can do a lot of things. I hope I was helpful.
I've created an alternative layout for one of my articles which can be applied successfully, but as has been highlighted in various forums: if you view the article using the Single Article menu type the alternative layout doesn't get applied because of an XML override.
I have a Joomla site that is setup for Sales and Support where the article info such as date, hits etc is useful but on the marketing side none of that is needed, hence an alternative layout would work well.
I want to know how to enable my alternative layout using the Single Article menu type - I've already got the layout how I want it (testing it by having it overwrite default.php) but want to set it up as marketing.php instead and only have it applied to what is needed.
You're probably not going to like this answer because you have already written you're alternate view. If you were rewriting it to begin with, why would you not write in a way that the side bar parameters (date, hits, ect) are within a container that is only loaded conditionally. This way you would only have one view to worry about and a lot less headaches.
I have an application where I need to display metrics. The application needs to display a separate vertical section for each metric. When I started this, there were only 5 metrics so I naively created a template with 5 regions, one for each metric I needed to display. Now, new metrics need to be added and I want to avoid adding "hardcoded" region divs in the template. I want to refactor this and create the required regions dynamically at startup time based on some configuration data.
So I have been looking at the latest Marionette release and in question "Dynamically add regions to Marionette layout", Derick Bailey mentions that Marionette v1.0 supports dynamic regions in Layouts through addRegion(), as in:
var layout = new MyLayout();
layout.render()
layout.addRegion("someRegion", "#some-element");
layout.someRegion.show(new MyView());
I have tried that in my code (using Marionette 1.0.2) and I am not getting it to work. I don't have a div with id="some-element" in my template and I suspect this could be the reason. I was hoping that Marionette would create that div itself.
Perhaps my expectation of what dynamically adding a region means is wrong. So my first question is: when adding regions dynamically to a layout, must the element id passed in the addRegion() function already exist in the layout?
If so, then I am back to the problem of having to "burn" in the template those divs for the regions to attach themselves too. My follow-up question is then: What is the best way of doing this in a data-driven fashion? Is it a matter of writing my own render() function so that the right set of divs get created? Or perhaps providing my Layout with a model object that will contain data which the template can then iterate through to create the necessary divs? How do we add regions dynamically to a Layout object if we don't know in advance how many regions we will actually need?
Aa #aaronfay specified, we need to use jQuery to create the element on the page. Here is some sample code:
var layout = new MyLayout();
layout.render()
var regionName = "dynamicRegion";
layout.$el.append('<div id="'+regionName+'"></div>');
layout.addRegion("someRegion", "#"+regionName);
layout.someRegion.show(new MyView());
I believe you would need to use jQuery (or similar) to create the element on the page. A Region expects the element to exist.
Otherwise, I believe your answer is here.
I am working on my first Windows 8 Metro app. I have worked a LOT with Silverlight and I am familiar with the Metro concepts. My challenge is, I know I want to create a "Section" page as defined here: http://msdn.microsoft.com/en-us/library/windows/apps/xaml/hh761500.aspx. Or, to put it another way, like the sample "Finance" app where "TODAY", "INDICES", "NEWS", etc. represent sections. But, I can't figure out how a "Section" page is defined in XAML.
I was expecting it to be similar to a tab control where each section is defined as a child of the parent control in the "Items" collection. However, I can't seem to find a solid example. Does anyone know an example they can point me to? Or a walkthrough online?
Thank you!
Try using a frame in your "master" page, and then adding other pages to that frame. A section in this paradigm is just a normal page. Most of the samples here in MSDN uses this type of design, with a master page displaying different sections, based on a selected item in a listview.
I've moved from Plone 3.1 to Plone 4.1 a site using zope.formlib for a number of non-archetypes content types, and including some customizations of the widgets.
Now I notice several changes in the layout of the edit forms, such as:
a tooltip replacing the field description (formHelp class)
larger text boxes, exceeding the border of the page body
duplicate descriptions in the checkbox widgets.
Since I'm not able to find relevant changes in the python modules and the page templates, I suspect that said changes mostly depend on the kss machinery, I'm not familiar with.
Any suggestions on what to focus on, in trying to obviate undesired changes?
I'd suggest to take the opportunity and to switch from zope.formlib to the most up to date z3c.form.
More info:
http://pypi.python.org/pypi/z3c.form
http://packages.python.org/z3c.form/
http://pypi.python.org/pypi/plone.app.z3cform