I'm using a VirtualTree as a layer selector for a mapping application, and I'm trying to have a "Layer" or "File" show a green icon when a layer is active and a grey icon when it is not.
Can you...
Set the icon of a selection? or
Bind an icon of an item of a VirtualTree to a boolean property of an array?
I see there is a property for: iconOptions that takes a map and this references qx.data.SingleValueBinding, but how to actually implement it is stumping me. My tree is getting created using:
var store = new qx.data.store.Json(url);
store.bind("model", tree, "model");
I tried:
tree.setIconPath("icon");
but that requires that I have an icon property for every element of my JSON file to display the Folder/File and doesn't allow for the multiple (on/off) capabilities.
Any suggestions?
have a look at virtual tree demo. Using the setIconOption you could specify a convertor takeing other data into account when deciding what type of icon to set.
Related
I'm using Material Table at the moment and am having difficulty customizing the position of the selection text (presented when one or more rows are selected via the checkbox).
Looking at the documents, I can see that the toolbar is overridable (https://material-table.com/#/docs/features/component-overriding), however the examples show simpler changes e.g. how to change the background color. I wonder if it's possible to separate the selection text from the toolbar and render it in a different location, like the below picture demonstrates.
Does anyone know if this is possible?
In the end, I turned off the row selection text in the toolbar by using showTextRowsSelected: false
I then made a custom footer using the row data presented by the onSelectionChange handler.
I'm trying to set up a form.IO form that will let me use the value of a field as part of the css class. This needs to take effect when the item is in the table view. If it also influences the form view that's ok because we don't have the element showing in the form view.
Specifically I want to get the following output:
<div class="[value]Stoplight"> </div>
The values from the object are going to be colors e.g. "yellow" so the result would be:
<div class="yellowStoplight"> </div>
Once I have that I can have my CSS file specify a background image based on the class and make it display the way I want.
Alternatively if I could put an html element of type image and have the source be different based on the value of the object that would work too.
Any ideas on how I could make either of those work? I'm not finding anything that relates to "dynamic css". Perhaps I'm looking for the wrong search criteria.
I have a dll that contains a form that is being inherited by other forms. The parent form has an imagelist with several images in it and two of these are being used in toolbar buttons. It has been working for a long time but I had to add a toolbar button and an image to go with it.
The new button with the new image displays in the designer correctly in the base form, but in an existing child form, the button doesn't display in the toolbar in the designer (although it shows up at runtime with no image). In the child form, the imagelist is present with all the original images, but the new image that I added to the base form does not appear in it.
I have tried several different icons with the same result. Interestingly when I point the new tb button to one of the images that has always existed, everything is fine in the child. It just won't handle any of the new images (I've tried icons & bitmaps). I would try to delete the toolbar and imagelist and re-create it but unfortunately I don't know where the existing images are located to be able to add them back to the new imagelist.
(VS 2010, VB.NET - but C# answers are most welcome!)
I have the same problem. My parent form have an image list wich I use to present my own control box (min, max, close). All the child forms inherit from this form and everything is ok if I don't change the elements of the list. But when I add an element or change the Image index of the control buttons, this is not reflected in the child forms. Sadly I haven't fixed it yet but what I did is:
Declare the Image list as public in the designer of the parent form
Determine the forms that don't reflect the desired change
Set Manually the desired change by adding the image to the inherited IMageLIst and changing the image index in all and every form with the bug
This is not what I intended to do by designing a parent form, but it works.
I am building a web application using ExtJS4 and I want to be able to get the source of an image element. I know I can use the line:
document.getElementById("imageID").getAttribute('src');
However, the issue I have with that solution is that the code is dependent on the id property. I won't be able to reuse this code if I have an class with a panel and an image inside since I will have conflicting ids if I duplicate the class. What I resorted to instead is to set an itemID in the image inside my panel.
Is there a way to get the image source using only the itemID property? Or do i really have to stick with my the id property?
I got it:
Navigate to your image element and assign it to a variable then do:
imgSrc1 = img.getEl().getAttribute('src');
where img is your image variable
Let's say I defined a IBM WCM authoring template called "AT-Image"; it creates content item "CT-Image" that contains elements such as an Image of type "Image", Description of type "Short Text", Keywords of type "Text", and other fields that serve as meta for that image resource.
Now, I need to create a content item called "CT-Article" based off from its "AT-Article" authoring template. Let's say that "Article" item has 3 elements: Title, Summary, and Image. Title and Summary are of type "Short Text". But Image needs to be of type "CT-Image" and not Image or Image component.
Is this possible Out-of-the-Box or is this something I need to implement myself via WCM API?
From my point of view you should use a menu component in the following way:
Let's assume you have got your CT-Image and CT-Article in a common sitearea called "MyArticle" like this:
MyArticle
CT-Article
CT-Image
Furthermore you need a WCM Menu component which uses two selection criteria:
current sitearea as location
CT-Image as authoring template
So then rendering CT-Article with a presentation template PT-Article you can reference the menu component. Therefore, you reference the menu component in the presentation template markup. The menu component then will pick up the CT-Image and render it as it is located in the same sitearea as your CT-Article.
That's rather a content design approach then a technical approach. It's all there out-of-the-box and saves custom development effort.
If I understand correctly, basically you want to create pre-defined images and then pick one of them to display when you create an article. Correct?
Well, the easiest way would be to utilize what WCM already gives you: create an Image Component. You will be able to upload the image and also provide a description, but you won't be able to set keywords or metadata. The workaround for this would be to set the keywords/metadata as part of the article. If that is okay, this would probably be the best way to do it.
By doing that, all you would have to do is select the relevant Image Component from your Image Element in AT-Article.
If you really need the images to be their own content items (rather than components) so that they have their own keywords and other information, then the next "easiest" way is probably to use an HTML Element inside AT-Article. In this HTML Element you will have to use the "Insert Tag" option, and then choose an Element Tag and use "Selected" rather than "autofill" or "current" to navigate to the content item that you want (the one with the image).
The code will look like this:
[Element name="[path]" type="content" context="selected" key="[element]"]
Where [path] is the path to the content item and [element] is the element that you actually want to pull from that content item (such as image, description, keywords, etc.)
context="selected" is the key there. Then you just need to set up your Presentation Template to be able to use this information that you are pulling in from the HTML Element.
WCM 8.5 has the InContext tag.
The InContext tag renders a tag body within a specified context. The new context can be specified as a predefined context by using a UUID, or by path.
For eg. in this case you can use below where key="Image" in InContext tag is the Link element to the CT-Image content item :
[InContext uuid="[Element context='current' type='content' key='Image' format='id']"]
[Element context="current" type="auto" key="Image"]
[Element context="current" type="auto" key="Description"]
[/InContext]