Subscribe for automatic updates: RSS icon RSS

Login icon Sign in for full access | Help icon Help
Advanced search

Pages: [1]
  Reply  |  Print  
Author Topic: Ask Reuben 45 - Rounded Image  (Read 4960 times)
Reuben B.
Four Js
Posts: 1116


« on: September 04, 2020, 03:01:09 am »

The solution of how to create a rounded image is a good one to demonstrate the benefits of the customisation feature of  Universal Rendering.  If you look to achieve this using our Native User Interface front-end, you won’t see an Image attribute or Presentation Style that controls this.  However Web Interfaces have a very simple CSS style that achieves this and Universal Rendering can use this same CSS style via customisation.

The CSS that achieves this is to use the CSS border-radius property.   Normally this is set to a small value such as 10% to create the effect of a rectangle with rounded corners.  However if you set this to 50% then the rounded corners meet in the middle to effectively make a circle.

Using customisation, you can apply this to your Universal Rendering interface and choose to render selected images as Rounded Images.

Read more at https://4js.com/ask-reuben/ig-45/

Product Consultant (Asia Pacific)
Developer Relations Manager (Worldwide)
Author of https://4js.com/ask-reuben
Contributor to https://github.com/FourjsGenero
Pages: [1]
  Reply  |  Print  
 
Jump to:  

Powered by SMF 1.1.21 | SMF © 2015, Simple Machines