Customize design of controls (e.g. Comboboxes, Checkboxes, etc.) Power apps for Teams

[FelixRech]

Hello too all, 

I'm developing an app in PowerApps for Teams and I'm currently in the stage of 'making it look pretty'. I do have to follow some guidelines when it comes to UI design, for example on the Fill and Border Color of TextInputs and Dropdowns. 

In Power Apps for Teams I have no trouble changing the Color of textboxes, Properties Fill and Border Fill are available though the usual menu. But I cannot seem to find a way to change the appearance of the comboboxes. Same applies to Checkbox and Radio Button controls, where I cannot change the color of the Checkmark.

Is there really no way to do it in Power Apps for Teams atm? Or am I missing something?

Kind regards!

[Ethan_R]

Hi @FelixRech ,

Do you have the property named 'Checkmark Fill' ?
Since you can change tick mark color from there. (This is Web App, since I'm not using Teams. Please check accordingly)

I had used custom checkbox as colored icon and button.

Its up to you how you like to display on the App.

Hope this helps.

[FelixRech]

Hi Ethan,

thanks for the reply.

Unfortunately this property is not present in Power Apps for Teams. At least not by default.

I was hoping there was a way to get the same customizability as in the Web app.

Kind regards.

[Ethan_R]

Okay @FelixRech ,

Try using transparent fill rectangle shape and bordered color.

OnClick of rectangle will update a variable (which acts as reference to your checkbox/ or act as dummy checkbox) and display Icon "Tick mark" (similar to checkbox but in your choice of color).

Make sure that your Icon is under the rectangle and not above it. else there might be click issue.

For having custom checkbox in gallery,
Hope you have some unique identifier with records of the gallery.

Then use,

//As an example

If(ThisItem.Contact in colMyContact.ID,
    RemoveIf(
        colMyContact,
        ID = ThisItem.Contact
    )
    ,
    Collect(
        colMyContact,
        {
            Name: ThisItem.'Full Name',
            ID: ThisItem.Contact
        }
    )
)

This is on transparent button which acts like dummy checkbox.

Hope this helps

[JR-BejeweledOne · Accepted solution]

The other thing you can do is go into Settings -> Experimental Features and enable classic controls.   You can choose to use the Classic combobox, checkbox and dropdown controls (and other controls), which allow you to style the controls the way you want.

[FelixRech]

Thanks for the suggestion, 
Is there any downside to using those classic controls?

[FelixRech]

Thanks for the suggestion. I will look into that and see how it performs.
I'm a bit afraid that I will create to many unnecessary control elements doing it this way. 

[JR-BejeweledOne]

Not as far as I know.   I think MS was trying to keep to the Teams theme and didn't really get that people might still have to follow branding guidelines when they added the new controls.

[FelixRech]

Ok good to know. I will check its worth changing all the elements!