Automatically resize ActiveX object in browser - activex

I'm programming activex component and adding it to html with object-tag. Is there a way to modify the height of this component dynamically, based on the contents (of activex)? Should I somehow call javascript code from inside c++ code, and ask javascript to resize object-element using DOM?

That would probably be the easiest way to do it; You can find out how to get a IHtmlElement reference to your object tag here: How to get a IHTMLElement pointer to the <object> tag hosting an activex control
You should then be able to set the width and height. Another (easier) option would be to set the width and height of your activex control to 100% and put it inside a div; then pass the id of the div into your activex control and use that to get the element by ID and resize that. Sometimes modifying the size of an object tag can act in unexpected ways.
FireBreath would abstract a lot of this for you and make it work on other browsers in addition; is there a reason you're doing this all by hand?

Related

Custom scrollbars for <vaadin-combo-box> , impossible?

I'm using vaadin-combo-box and I have a problem. I have no clue how to customize look and feel of scrollbars for the dropdown. I read about styling parts and I know how to do it but this seems to be impossible. Cant figure out the way to select #scroller element because it has been design not to be a "part" to style. However that is the only way I can think of to apply custom style to dropdown scrollbars. How can that be accomplished?
Thanks in advance for help.
#Update
Turns out that as of today there is no way of having customized styling on scrollbars for vaadin-combo-box component. Element responsible for scrolling resides inside contents shadow DOM and is inaccessible from outside nor its going to inherit style implemented on the parent part [part="content"]
The dropdown part is called vaadin-combo-box-overlay, see: https://vaadin.com/components/vaadin-combo-box/html-api/elements/Vaadin.ComboBoxOverlayElement And it is available for styling.
This allows to style the dropdown to some extent, but there is additional shadow root, that prevents to apply e.g. ::-webkit-scrollbar styles on #scroller element.
So the last option would be to make a copy of the vaadin-combo-box html file in right place in frontend directory. It happens so that that file will be used instead of the one coming from webjar. Then you can edit that html file directly. Of course this means that if there are changes in future versions of vaadin-combo-box, you need to copy again, re-apply changes

How does Component.setVisible() method work?

I have some experience with GWT . In GWT , widget.setVisible() method will add style="display:none" style to widget. But component of vaadin wouldn't . I checked with firebug , I can't see my component while set component's visible to false. Why ?
I think that should be also have hidden style instead of not containing. I reallize that vaadin's codes were server side. But sometimes , if I would like to just hidden (set style display to none) , has there anyway to accomplish this instead of using css ?
I don't understand concept of what different between without adding component and setVisible(false) ?
As you already noticed, an invisible component is not transferred from server to browser, and from browser's point of view the component doesn't exist. This approach has to benefits:
Less data to transfer from server to client
Security: User cannot inspect invisible components' generated HTML with tools like Firebug because those doesn't exist on the browser.
So basically from browser's point of view it's the same thing that you don't add it to the UI at all. But usually it's just easier to toggle component's visibility instead of adding and removing it from its parent.
If you want to hide components with CSS, you can do it by defining your own theme and adding a style for that there. Then just apply the style for the component you want to hide by using the addStyleName method.
SETVISIBLE Sets the visibility of the component.
Visible components are drawn in the user interface, while invisible ones are not. The effect is not merely a cosmetic CSS change - no information about an invisible component will be sent to the client. The effect is thus the same as removing the component from its parent.
So as the documentation says invisible components are not not visible.

AngularDart Element onResize event not linked to window

I'm working on a responsive, full-width layout and I need to do some element processing when the size changes. This has to not be linked to the window, as the size can change without the window size being modified e.g. changing number of columns.
I'm working with AngularDart directives and components and it would be nice to have a directive say, "resizable" which implements such an event for the element.
I've come across the attributeChanged() method in the Dart Element class but don't really know how to tap into that without creating custom elements.

Actionscript: Position elements one after another automatically

Is it possible to make Sprites position themselves one after another automatically.
Similar to display:display-block in CSS.
For example i'm adding Sprites to some parent in a row, the way they are in xml skin file and they are automatically position themselves next to each other.
Is there an event, which tells that a child were added to the parent?
I could implement some extended Sprite, to position pushed elements automatically, by calculating where the last element is located?
Why the hell Actionscipt doesn't have something like CSS in it? It's a pain in the ass to build UI inside it, compared to HTML...
Madness...
In case of "raw" ActionScript you should either search for an appropriate library or do it your self. ActionScript doesn't define any CSS like logic.
On the other hand Flex does, but you will not find any CSS that let you define layout. CSS is used to modify visual appearance of containers and components in Flex. Layout is usually done with the layout property of the container classes provided by Flex. For example yo can use a Group and set its layout property to an instance of HorizontalLayout or VerticalLayout. This will automatically position all child components of the group either in x or in y direction. In case of using Flex you cannot use sprites directly, but there are many components you can use. Maybe there is one for your purposes.
See the Flex API documentation. The spark.components package will be a good starting point.

TWebBrowser with Align set to alClient will not resize when client area changes

I have a form with several splitters and panels. In the middle is a panel that ends up with a TWebBrowser set to align alClient.
In the past this has worked well. However, on Windows 7 with Internet Explorer 8 the the browser is not correctly resized. Everything else (i.e. the panels) are the correct size, just not the web browser. Sometimes when you click into the browser, or more often when you scroll the browser will jump to the correct size. That does not happen 100% of the time though.
I'm trying to deal with the resize directly and force the control to change size. I can't seem to find a method that makes any difference (i.e. .Invalidate; .Repaint; .Update;)
TWebBrowser is an OLE control (ActiveX) that wraps the Internet Explorer control. Any ideas on how I can make the resize happen?
Updated Background:
I narrowed this down to only happening when I have a child form that I change the parent to site it inside another form. My TWebBrowser control is on a child form that I use anytime I need to show an HTML document.
In my parent form I have a Grid, a splitter, and a panel with the grid set to Align top and the panel set to align client. My child form (called THtmlViewer) has its parent set to the panel. The THtmlViewer form is set to alClient and TWebBrowser control on the child form is also set to align client.
If I do anything in the form resize of the THtmlViewer form I run into this issue. Anything being directly in FormResize or indirectly using the align properties. However, if I call my resize from the parent form everything works fine.
The key seems to be turning off the resize code in the THtmlViewer form. If I leave a OnResize handler or the alignment set then it does not matter what I do in the parent, the resize is not done correctly.
I am still confused why this is needed and why I can't force it to update in the correct resize (THtmlViewer).
As a side note I also noticed that Delphi 2007 on Windows 7 has the exactly same problem with the "Welcome Page" in the IDE.
I have worked around the issue by adding a method to set OnResize of the child form to nil and then call my internal ForceResize from the parent's OnResize handler. I would still like to deal with this all from the THtmlViewer form and would accept an answer that let's me avoid this hack.
To resize controls when their container changes size, you have two other options besides using "just" the Align property:
Use the Anchors property without the Align property, that is, set the Align property to alCustom or alNone, then set the anchors according to your needs. As the Align property is sort of short-hand for setting the Anchors, this is dependent upon the same alignment processing so may not work in your case.
Provide a handler for the OnResize event of the container on which the TWebBrowser sits and manually set the TWebBrowser's height and width to those of the container (optionally adjusted for any margins you want to have within the container).
That said, I don't have Windows7, so I can't vouch that this won't take more twiddling.
If your TWebBrowser jumps to the correct size on a scroll or click, it indicates that the control was sized correctly, just never received or processed the messages to actually respond to the changes.
This can be because realigning controls tries to prevent unnecessary repaints and recursions and somehow got mixed up. Using the OnResize method may then get better results as it "speaks to the TWebBrowser directly".
Repaint is "just" shorthand for Invalidate and Update unless the control has csOpaque in its ControlStyle, in which case painting seems more immediate. So you could try to fiddle with the Transparent property of the TWebBrowser and/or the container it sits on.
If all else fails, you could try to send a WM_PAINT (or similar) to the TWebBrowser directly. For exmample in the OnResize event of the TWebBrowser or the container it sits on. The a WM_Paint handler of the TWebBrowser calls OleDraw, which talks to the ActiveX directly using the ClientRect, which should have the correct dimensions when called from an OnResize event.
I had a similar problem.
It was solved by putting a TPanel "underneath" the TWebBrowser, and aligning the web browser to alClient.
Maybe the same solution for this question works: Resize problem using AcroPDF in Delphi
In OnResize:
if Visible and (WebBrowser1 <> nil) then
begin
FocusControl(nil);
FocusControl(WebBrowser1);
end;
I'd try something like
changing WebBrowser1.Align to alLeft,
setting WebBrowser1.Width to WebBrowser1.Width - 1 and
setting WebBrowser1.Align to alClient again
in an OnResize handler.

Resources