Rounded corners on <div:>'s - TDzHtmlText v6.4

[antonydanby]

I want to create a dashboard, I have shown one element of that dashboard below. It has been requested that all the boxes have rounded corners. I don't think that is possible right now with TDzHTMLText. Would it be something you would consider doing?

My source for this "box":

<fn:Urbanist><fc:#333333>

<div: x=10, y=10,
width=340,height=200,
margin=0,
thick=2,pad=0,
lncolor=#1e87e5,color=clWhite,outcolor=clWhite>
  <div:x=10,y=10><fc:#1e87e5><fs:14>Customer <b>123456789</b></fs></fc></div>
  <div:x=10,y=30><fs:12>Mr T. Tester</fs></div>
  <div:x=10,y=60><fs:10>Address:</fs></div>
  <div:x=80,y=60,width=240><fs:10><a:EDIT(Address,101, Testing Road, DN14 6ZZ)>101, Testing Road, DN14 6ZZ</a></fs></div>
  <div:x=10,y=110><fs:10>Email:</fs></div>
  <div:x=80,y=110><fs:10><a:EDIT(EMail,ttester@gmail.com)>rtester@gmail.com</a></fs></div>
  <div:x=10,y=130><fs:10>Phone:</fs></div>
  <div:x=80,y=130><fs:10><a:EDIT(Phone,07770 123456)>07770 123456</a></fs></div>
  <div:x=10,y=150><fs:10><b>D.O.B.:</b></fs></div>
  <div:x=80,y=150><fs:10><b><a:EDIT(DOB,01/09/1980)>01/09/1980</a></b></fs></div>
</div>

</fc></fn>

[digao-dalpiaz]

Testing...

[antonydanby]

I tested them and they look really good, thank you. Just out of interest what value did you give the radius in the screen shot above, it looks really good. Better still do you have the actual html ?

[antonydanby]

Although it works for me my corners look a bit blocky. Is it possible I can grab the html you used to create the result above please and then I can work out what I am doing wrong

[digao-dalpiaz]

I tested them and they look really good, thank you. Just out of interest what value did you give the radius in the screen shot above, it looks really good. Better still do you have the actual html ?

<fn:Urbanist><fc:#333333>

<div: x=10, y=10,
radius=20,
width=340,height=200,
margin=0,
thick=2,pad=0,
lncolor=#1e87e5,color=clWhite>
  <div:x=10,y=10><fc:#1e87e5><fs:14>Customer <b>123456789</b></fs></fc></div>
  <div:x=10,y=30><fs:12>Mr T. Tester</fs></div>
  <div:x=10,y=60><fs:10>Address:</fs></div>
  <div:x=80,y=60,width=240><fs:10><a:EDIT(Address,101, Testing Road, DN14 6ZZ)>101, Testing Road, DN14 6ZZ</a></fs></div>
  <div:x=10,y=110><fs:10>Email:</fs></div>
  <div:x=80,y=110><fs:10><a:EDIT(EMail,ttester@gmail.com)>rtester@gmail.com</a></fs></div>
  <div:x=10,y=130><fs:10>Phone:</fs></div>
  <div:x=80,y=130><fs:10><a:EDIT(Phone,07770 123456)>07770 123456</a></fs></div>
  <div:x=10,y=150><fs:10><b>D.O.B.:</b></fs></div>
  <div:x=80,y=150><fs:10><b><a:EDIT(DOB,01/09/1980)>01/09/1980</a></b></fs></div>
</div>

</fc></fn>

[digao-dalpiaz]

Although it works for me my corners look a bit blocky. Is it possible I can grab the html you used to create the result above please and then I can work out what I am doing wrong

It's probably because you're using it in VCL. The example I sent is in FMX. In the VCL there is no Alpha channel, and therefore the VCL does not apply corner smoothing. In FMX, the alpha channel is native.

[antonydanby]

Ah that makes total sense. The development is being done inside a DLL maybe we can use FMX inside the DLL ? Who knows. Thanks a lot for this. Even though it has a bit of a blocky appearance in VCL it's still usable and I think we might be able to mask that a little bit by making thick=3 instead of thick=2

[digao-dalpiaz]

Done!

[digao-dalpiaz]

Reopening, because it's possible to use GDI+ in Windows (VCL) to draw rounded corners using Anti Aliasing....

[digao-dalpiaz]

Without anti-aliasing:

With GDI anti-aliasing (VCL + Windows):

[antonydanby]

Now that is really nice, especially given it is in VCL. Thank you so much:

[digao-dalpiaz]

Available in version 6.6