cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Super User
Super User

BUG: Form and Colors Not Rendering Correctly

I've been working with this app today with no issue. While working on the OnStart Function, I closed and reopened the app to test the new function. Upon opening, my Form is not rendering correctly. Also some of the Controls in my app are black. 

Example: renderingBug.png

Session ID: d7999764-c67f-4c3f-9956-9262fec39dfc
PowerApps Version: 3.18112.22

App ID: 18ea6777-ab27-4454-92c0-f097f4721024

Settings: 

  • All Preview Settings ON
  • All Experimental Settings OFF except "Use Column Display Names"

OnStart Function: The issue happened when I added the "id" column to colVehicles. There are NO errors showing anywhere.

 

Set(
    varSwatchTest,
        Table(
            {header: "Primary"},
            {color: "primary_fill", colorValue: "#008291"},
            {color: "primary2_fill", colorValue: "#4FA3AE"},
            {color: "primary3_fill", colorValue: "#2D8A97"},
            {color: "primary4_fill", colorValue: "#076572"},
            {color: "primary5_fill", colorValue: "#014F5A"},
            {header: "Secondary"},
            {color: "secondary_fill", colorValue: "#3C4D5D"},
            {color: "secondary2_fill", colorValue: "#74828F"},
            {color: "secondary3_fill", colorValue: "#536474"},
            {color: "secondary4_fill", colorValue: "#2E3032"},
            {color: "secondary5_fill", colorValue: "#03101B"},
            {header: "Accent"},
            {color: "accent_fill", colorValue: "#F85D13"},
            {color: "accent2_fFill", colorValue: "#FF9C6D"},
            {color: "accent3_fill", colorValue: "#FF8144"},
            {color: "accent4_fill", colorValue: "#C64202"},
            {color: "accent5_fill", colorValue: "#9D3300"},
            {header: "Grayscale"},
            {color: "grayscale_fill", colorValue: "#000000"},
            {color: "grayscale2_fill", colorValue: "#F5F5F5"},
            {color: "grayscale3_fill", colorValue: "#C8C8C8"},
            {color: "grayscale4_fill", colorValue: "#787878"},
            {color: "grayscale5_fill", colorValue: "#282828"},
            {header: "Additional"},
            {color: "overlay_fill", colorValue: "#a9a9a9"},
            {color: "info_fill", colorValue: "#007DC6"},
            {color: "success_fill", colorValue: "#0EA80E"},
            {color: "warning_fill", colorValue: "#F7B512"},
            {color: "danger_fill", colorValue: "#C40000"}
        )
);
ClearCollect(
    colVehicles,
        Table(
            {id: 0, vehicle: " ", test: " "},
            {id: 1, vehicle: "0", test: "UMT1"},
            {id: 1, vehicle: "0", test: "UMT2"},
            {id: 2, vehicle: "1", test: "UMT3"},
            {id: 2, vehicle: "1", test: "UMT4"},
            {id: 3, vehicle: "2", test: " "},
            {id: 4, vehicle: "3", test: " "},
            {id: 5, vehicle: "4", test: " "},
            {id: 6, vehicle: "5", test: " "},
            {id: 7, vehicle: "6", test: " "},
            {id: 8, vehicle: "7", test: " "}
        )
);
Set(varTime, TimeValue(Text(DateAdd( Now(), TimeZoneOffset(), Minutes )),"en"))

Fill Property of black object: ColorValue("#4fa3ae")

Any ideas why I'm seeing this error or how to troubleshoot/debug?

Thank you

 

6 REPLIES 6
Highlighted
Super User
Super User

Re: BUG: Form and Colors Not Rendering Correctly

To add to the weirdness (not a flattering adjective for an IDE!)... I copied and pasted one of the controls in question (black one) and it pasted with its correct Fill color!!

renderingBug1.png

Same thing for the buttons:

renderingBug2.png

Highlighted
Super User
Super User

Re: BUG: Form and Colors Not Rendering Correctly

And the Form, when copied and pasted rendered correctly. Of course, I have to deal with all the "_1" 's appended to each Form Control (star, error, input, label) throughout my code up to this point... grrr.

Highlighted
Super User
Super User

Re: BUG: Form and Colors Not Rendering Correctly

...And... when Closing/Opening the app... things are back to the error...

What gives here?

2018-12-03_13-43-56.png

Highlighted
Community Support
Community Support

Re: BUG: Form and Colors Not Rendering Correctly

Hi @ericonline

Do you mean that your app would not be rendered well when you closed and reopened your app?

I have made a test on my side, and don't have the issue that you mentioned.

Please take a try to turn off/disable the "Delayed load" option and "Improved app rendering (final validation)" option within Advanced settings of App settings of your app, then save your app and re-load it, check if the issue is solved.

Please also take a try to clear cache of your browser, and then run your app again, check if the issue still exists.

If the issue still exists, please consider re-create your app to fix this issue.

 

Best regards,

Kris

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.
Highlighted
Super User
Super User

Re: BUG: Form and Colors Not Rendering Correctly

Yes, when closing and opening the app, the controls that I had copied and pasted reverted back to black. I gave up and closed the app altogether. Today when opening the app, the controls appear correctly. THIS IS NOT A FIX. This just means that whatever bug was preventing me from building my app has "disappearred". The screenshots are there, I posted the issue in real time... This is the type of stuff that concerns me about a hosted IDE.

Highlighted
Super User
Super User

Re: BUG: Form and Colors Not Rendering Correctly

I've found that the OnStart is when the actual App starts, so keep a separate tab with the webapp open. I've not seen the onStart trugger when you're using the studio to edit it.. They may have updated this with the improved rendering but I always create a button on my configuration screen called "Test OnStart", and have it's onSelect perform the same steps as OnStart so that I can  trigger it manually when needed. (like when trying to reset without having to close out of it and go back in)

 

Not sure if it was intentional but you might have a spelling error in your code for one of the vars:

{color: "accent2_fFill", colorValue: "#FF9C6D"},

 


@iAm_ManCat

Please 'Mark as Solution' if someone's post answered your question and always 'Thumbs Up' the posts you like or that helped you!


Thanks!
You and everyone else in the community make it the awesome and welcoming place it is, keep your questions coming and make sure to 'like' anything that makes you 'Appy
Sancho Harker, MVP


Helpful resources

Announcements
secondImage

Demo-Extravaganza 2020

Check out these cool Power Apps & vote on your favorite!

secondImage

Robotic Process Automation

Let's talk about the solution provided by Microsoft for Robotic Process Automation (RPA)

secondImage

Community Highlights

Check out whats happening in Power Apps

secondImage

Community User Group Member Badges

FIll out a quick form to claim your community user group member badge today!

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Top Solution Authors
Top Kudoed Authors
Users online (10,917)