It’s a bug. When you remove a tabPage it should disappear. If you refresh the browser you’ll see the correct view. I will send you a test app after this bug is fixed.
I’d like to add a property to hide the TabPage instead of removing it. Maybe we can expose the Visible property and use that one.
Hi
In VWG we had the logical appearance for tab control. This made the tab headers ‘visible = false’
This option is not available in wisej. So even when adding/removing tabs you will always have the tab header on show as in the screenshot.
What would be good for me (from a purely selfish point of view !) is to add this option to wisej.
Yes, there are some minimum layouts that are imposed by the javascript widget system. Since the inner image width/height properties are set in theme to force the resize of the svg image the widget enforces the minimum size.
Hi Luca,
I probably wasn’t very clear. I am talking about the size of the button, NOT the size of the image. If you have a 10×10 pixel button and set its ImageSource property to a theme image (svg), the button is displayed larger at run time, to accommodate, I guess, the larger image !
Alex
The size of the icon in the button is determined by the theme, except when the image is set to overlay. It can be changed using an ImageList. Earlier we were displaying the images in their original size and most of the times they were too big, especially SVGs where they are designed in a larger canvas and need to be resized.
If you see a larger image you may be using an old Classic-2.
Hi Luca,
This is indeed a lot of info, even the recommended SVG editor. May I ask you to add all this info to the documents (even the SCG editor part)?
Thank you Luca!
Concerning the size of a button with an svg ImageSource getting larger than design, is this a known “feature”?
Alex
Forgot to add that you can update a bunch of images all at once if you have the files in a folder. In the Images tab click the last button “Import icons from a folder”. It will add all the png, svg, gif, and jpg that it finds in the folder.
Thank you for adventuring in the theme builder. 🙂
There are several “ergonomic” issues and improvements that are certainly needed. To explain better:
There are other bugs with the built in editor when editing mixins that are also fixed in dev coming up in the update.
They are unique throughout the session and assigned in order of creation starting from 1 up to 2,147,483,647 (0x7FFFFFFF or int.MaxValue).
Once the counter reaches max value it restarts from 1 but it also starts checking if the id is in use and skips the used ones. So it’s always guaranteed to be unique and fast. The chances of an app to create and destroy 2 billion controls are slim and even it does it’s still unique.
You can also get the actual id string like this ((IWisejComponent)control).Id – it’s the same as “id_” + control.Handle.
However, if the control is not created yet (control.Created == false) the Handle is 0 and the id string is null. The only way to force the creation of the control is to call control.CreateControl(), but it will create all children and all parents.
Creating a control simply means that the control is fully registered and sent to the client to be turned into a widget. In the new build (the one that Alex is using as an experimental build) this will happen on when the control is made visible the first time.
The new update is coming up with a very substantial speed increase in the UI code (server and client).
Yes, this version in the C# code works too!
This means that a server control’s .Handle property reflects at runtime the widget’s id_xxx ? Nice…
How “unique” are these id_’s ? I mean, if my button and the Upload control are encapsulated within a usercontrol, then the button has id_1 and the upload control has id_2, are these id_’s unique in the usercontrol or also in the parent component of the usercontrol and finally in the top level Form?
Best,
Alex
Hi,
I wanted to add some new svg images in a mixin.theme file. So I describe my … adventures:
I created a Classic-2.mixin.theme (an empty text file) in the /Themes folder. This cannot be opened by the theme editor.
Then I created a new theme in the editor, but it asks to inherit from a theme and when it does, it fills the new theme with a copy of the one it inherits and I had to remove all the contents apart from the name and images.
Then I imported the images I wanted, which have to be imported one by one. I first had to give a name, press OK and in the following dialog select the file, which is automatically base64-encoded and saved. If I pressed cancel in this second dialog, the image is still created with the name I gave in the first dialog and is empty. If I may make a suggestion, it would be better if one could select the image files from an open folder dialog, they get created with a name=filename and then one can change the theme image name.
Ah, if I press the + button in the left pane to add an image, this is created and its name in the right pane with the images shows like “my-new-image (256 x 256)”. If I press the + in the right pane (the one that shows the images), the displayed name is “my-new-image” without the (256 x 256).
Saved as Classic-2.mixin.theme in the /Theme folder. If I go now to select the ImageSource for a control, the newly added images do not show up in the theme images. However, if I set by hand ImageSource=”my-new-image” it is displayed correctly.
A bug here: is that if I set a button’s ImageSource to a theme image (either the ones I created or the already available ones), the button’s size cannot be smaller than some value, I suspect the minimum size of the image.
Having said all this, the theme editor is a great feature, and the fact that it produces a clean text file is awesome! After all, one can retreat to good old Notepad! 🙂
Best,
Alex
You can add theme images in a mixin, it will not be erased by a theme change. A theme mixin is added to any theme loaded by the app. Add a file “MyTheme.mixin.theme to /Themes. It can override any theme and add/replace any setting. You can edit it with the theme builder as well.
Look inside the theme files. All image strings there are embedded data base64 images.
In Visual Studio right click on the image file (better if in /Images bu can be anywhere) and select “Embedded Resource” in the Build Action property. It will build the file into the assembly as an embedded resource.
Yes, the image editor is the dialog that pops up when you select an ImageSource.
SVG good editor controls that can be embedded in VS are hard to find. There are many open source editors and even online editors: http://svg.recitmst.qc.ca/
Wow, this is a lot of information! The basic idea is that we can use ImageSource and not Image. But:
point 2. Didn’t know about theme images! And we can add more images in a theme? Or custom theme? And what happens to our customizations when a new Wisej release comes out? I remember trying to remember all the changes I had made to a VWG theme whenever a new version came out… brrrr
point 3. What is an embedded data, base 64 image? Any example?
point 5. How can I make an svg embedded? When I insert it in Properties/resources, the Persistence is greyed out to “Linked at runtime”, cannot change it to embedded.
And last but not least… What is the image editor? Do you mean when we set the imagesource for a control, i.e. the “ImagePicker” ? Cause I don’t see any image “editor” for svg as we have for, say, jpg….
Best,
Alex
Thanks. The focus/blur (and related validation) broke when we added the Tools to the textbox because that required wrapping the actual input control into an outer widget. It’s fixed in dev.
Hi Luca,
Thanks for the info.
They are all the same for now. Only full row select is currently implemented. The base grid class doesn’t support anything different than the row select and we need to implement additional selection data models.
Hi Luca,
Cancel the Validating event: Wisej will force (it may fail if you keep clicking due to timing issues :)) the invalid control to gain the focus back, it will automatically set the Invalid property to true and you may optionally set the InvalidMessage tooltip.
I agree with you about the request/response in a web app but in the sample I sent yesterday, I am cancelling the Validating event by setting e.Cancel to true. But still, I was able to make an entry into the next textbox even if the previous textbox hasn’t passed the validation yet. Also, I concentrated on mouse click when I sent you the test project. But now, when I tried using Tab to go from one control to another, the Validating event doesn’t always fire. I believe that it should fire everytime the textbox loses focus.
Do not cancel the Validating event. But you can set the control to Invalid and set the InvalidMessage. This is more “web-like” where the actual full validation is executed on save but you show the invalid state.
This approach will resolve the problem as cancelling the event is very restrictive to the user and this is what I follow in a real-world application and revalidate all or invalid controls before saving.
Use the ErrorProvider to display an error icon next to the invalid control, similar to the method above
The test project I sent you is using the ErrorProvider to notify the user of invalid data.
I am attaching the revised test project that shows the value of the Invalid property everytime the Validating event is fired. I also includes a DataGridView to show how CellValidating event works. The cursor always stays in CustomerID if it is invalid.
Thanks.
Hi Alex,
SVG images cannot be assigned to the Image property because they cannot be converted to a .NET image. You can use them in 5 ways now:
The image editor now lets you pick and preview a local file, a theme image, and an image URL.
There is a pending enhancement to add embedded image resources to the files list as root folders. It will allow you to pick embedded file resources in the editor instead of assign it by hand (see above option 5). This enhancement works with additional extensions that have not been published yet, they are bundled icon sets in a single assembly, like FontAwesome.
There is a bug if your image name has a space in it it won’t work.
Will add this to the docs.
Best,
Luca
I have a better solution for you without using the JavaScript component.
this.upload1.CreateControl();
this.button.Eval(
String.Format(@"
this.uploadButton = Wisej.Core.getComponent(""id_{0}"");
this.addListener(""execute"", function(e)
{{
this.uploadButton.upload();
}});", this.upload1.Handle));
You can also put this in a Button class and add a property that lets you connect it to any upload control. This script saves the reference to the upload widget in line “this.uploadButton = …” and calls upload() when clicked. This way you can connect the two dynamically or in a button class.