Answered

Custom control styling

(2) Share

Report

Posted on by ashlega

Hi,

If I wanted to have a custom input control that had some validations, and, possibly, other logic behind it... How would I style it so that it matched the styles of the out-of-the-box controls? (height, width, border, fonts, etc)

Should I just look up the styles on the OOB controls and re-use them? I'm guessing it would not be "supported" since it's just short of working with the HTML. Would not want to re-create the styles in my own css files since, sooner or later, they will get out of sync with the oob styles.

Thanks,

Alex

All responses (7)

Answers (1)

ashlega 90 on at

Like (0)

Report

Re: Custom control styling

Ah... perfect. Just voted (and added a comment asking for a bit more:)) )
Community Power Pla... on at

Like (0)

Report

Re: Custom control styling

Hey Alex, I was thinking the same thing.. i had a powerapp idea for that:
Re: [Idea] Harness should use standard CRM font
ashlega 90 on at

Like (0)

Report

Re: Custom control styling

Thanks!

PS. Client API with OOB would work, of course, but I'm mosly just trying to see what's doable with PCF.
AnqiChen on at

Like (1)

Report

Re: Custom control styling

Filip is right, in addition:

If it's simply regex validation, it could use OOB control with clientAPI onchange handler to trigger notification.
Verified answer

FilipK on at

Like (2)

Report

Re: Custom control styling

Hi @ashlega there is currently no good way to do this in preview. For GA of PCF, we plan to make these values available to the control developer through our new theming system.
ashlega 90 on at

Like (0)

Report

Re: Custom control styling

Hi Anqi,

thank you for the reply. It seems that's a different question, though. What I am asking is that on the screenshot below I need my Regex Validation custom "input" control to mimic the styles of the out-of-the-box "name" input control. Otherwise, the border is different, yet it does not disappear when the focus moves to another control, the font is not "bold" , etc etc. There might be no easy way to achieve that right now without recreating the styles, but I just wanted to confirm (also, in that case, maybe you would consider exposing default styles so we could reuse them in the PCF?)
AnqiChen on at

Like (1)

Report

Re: Custom control styling

hi Alex,

It looks like a similar question. This is one way that could achieve this. There definitely could have other ways.

https://powerusers.microsoft.com/t5/PowerApps-Component-Framework/Use-SetNotification-to-show-error-messages/m-p/292977#M246

Anqi