Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Resizing component issue at run-time
#1
I have an memo field with resize option (resizeDirection rdBoth) and a button under the component at design. 

The issue is that the button under the memo component is rendering in the same position rather than floating with the memo size so then there is all this space under the memo or the memo just draws over everything under.  How do I make the content under the memo shift or change position so the content under just floats with the memo resize?

I tried using the memo in a region and changing resize options in a parent container type concept but still no dice.

Hopefully someone has done this before or perhaps there is a property I missed somewhere.  I have gone through the demo project and documentation but if a demo has this concept somewhere I am all ears.

Cheers.
Reply
#2
Resize option is to allow user to resize with the added grab handle.

Look at anchors and aligns - they work just like in a VCL application.
Reply
#3
Thank you for your hint. I went through the anchor and align but they just seem to work in relation to the parent container. The memo field above the button just resizes over all. The good news now is that when I put the button in this example in a region when the memo draws it goes under the controls so the user can see everything. A better design would be to have the components with a property called flex as an example that could be set if desired so when something grows or shrinks, the component would just flow along with it. Seems like something got missed in IW when a memo is allows to resize but then it just draws over everything by default. I will keep plugging at it as I have time to be fancy.
Reply
#4
IntraWeb 17 has the types of new layouts you speak of.
Reply
#5
Put the memo and the button inside a IWRegion. Then, in your Memo and Button, set StyleRenderOptions.RenderAbsolute to FALSE.

Now your button will move along with the Memo, whenever it is resized. However, you need to adjust the position of the button, at design time, in a way that it is not exactly how it is supposed to look at runtime, or set it at run time.(IWForm's OnCreate event is a good place to do that). That's because the VCL designer is not able to do all the same tricks that CSS does.

Explanation for the position issue: When you set IWButton1.top := 500 using the object inspector, IW will generate HTML/CSS instructing the browser to place IWButton 500 pixels away from its parent top-left edge. When you make it "relative" (setting RenderAbsolute to False), the browser will displace it 500 pixels from where it should be originally, so it will place the IWButton 500 pixels away from Memo Bottom-Left edge (because both have relative positions and the browser will use the Memo control to calculate the original position of the button control). That's kind of tricky...

If you don't understand the short explanation above, don't worry... It is actually quite confusing indeed and hard to mentally visualize the effect without any help from the browser. So I recommend you to give it a try and find the best settings after some experimentation.

Please let me know if it worked
Reply
#6
Wow, this is great. Thank you. I knew that I was missing something there. StyleRenderOptions.RenderAbsolute! Amazing. Now all is working and as you said and I have to adjust the top left start run-time coordinate from where I place in design so then it will render in the correct starting position. The interesting thing is the the button from CGWebTools responds better in the horizontal start position than the IW button. I have to place the IW button way more over to the left to render where I want. When I deleted the IW button and then recreated now it seems to be better now. Maybe something was in there from all the experimenting I was doing to get this to work before your suggestion. I am a happy camper! Many blessings of gratitude Alexander. Cheers!
Reply
#7
(02-21-2019, 07:47 AM)bob9999 Wrote: Wow, this is great.  Thank you.  I knew that I was missing something there.  StyleRenderOptions.RenderAbsolute!  Amazing.  Now all is working and as you said and I have to adjust the top left start run-time coordinate from where I place in design so then it will render in the correct starting position.  The interesting thing is the the button from CGWebTools responds better in the horizontal start position than the IW button.  I have to place the IW button way more over to the left to render where I want.  When I deleted the IW button and then recreated now it seems to be better now.  Maybe something was in there from all the experimenting I was doing to get this to work before your suggestion.  I am a happy camper!  Many blessings of gratitude Alexander.  Cheers!

An interesting anomaly is with the IW label component.  I set this the same way and this stays static as if this property is not recognised or is ignored.  So it looks like the movement below a growing field has to be an action component (edit, checkbox, button, etc).  Also when I place a button to the right of the memo the same way, it only float vertical.  I will take this into account in my design but I just wanted to mention the results of my experiment. Cheers!
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)