I'm creating a side bar navigation with a dark and light mode option. This is the code in the "Formulas"
varAppColorMode="";
PrimaryColor=If(varAppColorMode="Dark",RGBA(45,96,46,1),RGBA(255,255,255,1));
PrimaryColor_Text=If(varAppColorMode="Dark","RGBA(45,96,46,1)","RGBA(255,255,255,1)");
AccentColor=If(varAppColorMode="Dark",RGBA(253,185,39,1),RGBA(51,134,43,1));
// Adjusted accent color to complement primary
AccentColor_Text=If(varAppColorMode="Dark","RGBA(253,185,39,1)","RGBA(51,134,43,1)");
TertiaryColor=If(varAppColorMode="Dark",RGBA(34,73,35,1),RGBA(244,244,244,1));
// Darker shade of primary for dark mode
TertiaryColor_Text=If(varAppColorMode="Dark","RGBA(34,73,35,1)","RGBA(244,244,244,1)");
PrimaryTextColor=If(varAppColorMode="Dark",RGBA(247,247,247,1),RGBA(45,96,46,1));
// White for dark mode and primary color for light mode
PrimaryTextColor_Text=If(varAppColorMode="Dark","RGBA(247,247,247,1)","RGBA(45,96,46,1)");
SecondaryTextColor=If(varAppColorMode="Dark",RGBA(170,204,170,1),RGBA(170,204,170,1));
// Complementary lighter shade of primary color
SecondaryTextColor_Text=If(varAppColorMode="Dark","RGBA(170,204,170,1)","RGBA(170,204,170,1)");
AccentTextColor=If(varAppColorMode="Dark",RGBA(51,134,43,1),RGBA(22,25,39,1));
// Use primary color for dark mode accent text
AccentTextColor_Text=If(varAppColorMode="Dark","RGBA(51,134,43,1)","RGBA(22,25,39,1)");
HighlightColor=If(varAppColorMode="Dark",RGBA(45,96,46,1),RGBA(215,219,230,1));
// Use primary color for dark mode highlight
HighlightColor_Text=If(varAppColorMode="Dark","RGBA(45,96,46,1)","RGBA(215,219,230,1)");
varHoverFill=If(varAppColorMode="Dark",RGBA(255,255,255,0.1),RGBA(0,0,0,0.1));
// Remain unchanged for hover effect
varPressedFill=If(varAppColorMode="Dark",RGBA(255,255,255,0.2),RGBA(0,0,0,0.2));
In my component I enable Access app Scope and use the following code on a button that will toggle light/dark mode
If(varAppColorMode = "Light",Set(varAppColorMode,"Dark"),Set(varAppColorMode,"Light"));
I get this error on the "varAppColorMode":
Unexpected characters. The formula contains 'PowerFxResolvedObject' where 'Ident' is expected.
This is from a tutorial I've been following from Tolu Victor.
Not sure how to troubleshoot this issue, even if I set the variable back on the screen to light it doesn't stop the error.
I figured it out, it was an issue with App.Formula where I had
varAppColorMode="";
Adding this here apparently doesn't set it globally so I added
Set(varAppColorMode,"Light");
to the App.Onstart (I did try adding it to App.Formulas, didn't work).
Hopefully no one asks me to make it remember the settings on launch 🙄
Thanks for the reply, i think i see what you're doing there, but the problem is still there when i try to add a button to the component to toggle that variable. the theme colors i have are also tied to the component
Set(varAppColorMode, "Dark");
Collect(AppThemes,
{
PrimaryColor: If(varAppColorMode="Dark",RGBA(45,96,46,1),RGBA(255,255,255,1)),
PrimaryColor_Text :If(varAppColorMode="Dark","RGBA(45,96,46,1)","RGBA(255,255,255,1)"),
AccentColor:If(varAppColorMode="Dark",RGBA(253,185,39,1),RGBA(51,134,43,1)),
// Adjusted accent color to complement primary
AccentColor_Text :If(varAppColorMode="Dark","RGBA(253,185,39,1)","RGBA(51,134,43,1)"),
TertiaryColor:If(varAppColorMode="Dark",RGBA(34,73,35,1),RGBA(244,244,244,1)),
// Darker shade of primary for dark mode
TertiaryColor_Text:If(varAppColorMode="Dark","RGBA(34,73,35,1)","RGBA(244,244,244,1)"),
PrimaryTextColor:If(varAppColorMode="Dark",RGBA(247,247,247,1),RGBA(45,96,46,1)),
// White for dark mode and primary color for light mode
PrimaryTextColor_Text:If(varAppColorMode="Dark","RGBA(247,247,247,1)","RGBA(45,96,46,1)"),
SecondaryTextColor:If(varAppColorMode="Dark",RGBA(170,204,170,1),RGBA(170,204,170,1)),
// Complementary lighter shade of primary color
SecondaryTextColor_Text:If(varAppColorMode="Dark","RGBA(170,204,170,1)","RGBA(170,204,170,1)"),
AccentTextColor:If(varAppColorMode="Dark",RGBA(51,134,43,1),RGBA(22,25,39,1)),
// Use primary color for dark mode accent text
AccentTextColor_Text:If(varAppColorMode="Dark","RGBA(51,134,43,1)","RGBA(22,25,39,1)"),
HighlightColor:If(varAppColorMode="Dark",RGBA(45,96,46,1),RGBA(215,219,230,1)),
// Use primary color for dark mode highlight
HighlightColor_Text:If(varAppColorMode="Dark","RGBA(45,96,46,1)","RGBA(215,219,230,1)"),
varHoverFill:If(varAppColorMode="Dark",RGBA(255,255,255,0.1),RGBA(0,0,0,0.1)),
// Remain unchanged for hover effect
varPressedFill:If(varAppColorMode="Dark",RGBA(255,255,255,0.2),RGBA(0,0,0,0.2))
}
);
Set(PrimaryTheme, First(AppThemes));
And Converted
Hi @kilaj1
Thanks, just wanted to be sure. Ok so I know what you are doing, I just wouldn't do it that way, its just me.
Since I have many themes I do this.
Set(appThemeMode, "Dark");
Collect(AppThemes,
{
ButtonColor: If(appThemeMode = "Dark", Color.Black, Color.White)
}
);
Set(PrimaryTheme, First(AppThemes));
And now PrimaryTheme. gives you that themes colors.
You dont have to type First(Colletionname etc), but this way I can have many themes live at once. and I just give it a specific Variable to hold it.
Yours would be super easy to convert to that.
If I have helped you, I would really appreciate if you please Mark my answer as Resolved/Answered, and give it a thumbs up, so it can help others
Cheers
Thank You
Michael Gernaey MCT | MCSE | MCP | Self-Contractor| Ex-Microsoft
https://gernaeysoftware.com
LinkedIn: https://www.linkedin.com/in/michaelgernaey
oo sorry it the App property
Hi @kilaj1
Sorry I am not following by you said you put this in the "Formulas".
Can you please share a picture of exactly where you put this? I understand what you are trying to do, I wouldn't do it that way, but right now i just want to help you fix what your issue is.
Thanks,
If I have helped you, I would really appreciate if you please Mark my answer as Resolved/Answered, and give it a thumbs up, so it can help others
Cheers
Thank You
Michael Gernaey MCT | MCSE | MCP | Self-Contractor| Ex-Microsoft
https://gernaeysoftware.com
LinkedIn: https://www.linkedin.com/in/michaelgernaey
WarrenBelz
146,653
Most Valuable Professional
RandyHayes
76,287
Super User 2024 Season 1
Pstork1
65,999
Most Valuable Professional