Being able to change background color java

[jc1bryan (Lightning Kings)]

Hello to everyone who is reading this! I am trying to create a “Light Theme & Dark Theme” type extension. I have received help from well experienced people and I must thank you. I have progressed but the last piece to my puzzle is trying to change the background color of the screen when a button is pressed. Now I could just use “Set Screen1 Background Color to” and assign it to a button but I want the challenge. Post below is a snippet of my code so far.

~ CODE ~
package io.makeroid.jc1bryan_82242.TestingColor1;

import com.google.appinventor.components.annotations.DesignerComponent;
import com.google.appinventor.components.annotations.DesignerProperty;
import com.google.appinventor.components.annotations.PropertyCategory;
import com.google.appinventor.components.annotations.SimpleEvent;
import com.google.appinventor.components.annotations.SimpleFunction;
import com.google.appinventor.components.annotations.SimpleObject;
import com.google.appinventor.components.annotations.SimpleProperty;
import com.google.appinventor.components.annotations.UsesPermissions;
import com.google.appinventor.components.common.ComponentCategory;
import com.google.appinventor.components.common.PropertyTypeConstants;
import com.google.appinventor.components.runtime.AndroidNonvisibleComponent;
import com.google.appinventor.components.runtime.ComponentContainer;
import com.google.appinventor.components.runtime.*;

/* FOR BACKGROUND CHANGING
import android.app.Activity;
import android.widget.RelativeLayout;
import android.graphics.Color;
import android.view.View;
import android.os.Bundle;
import android.widget.Button;*/

@DesignerComponent(
version = 1,
description = “Extension made with Kodular IDE”,
category = ComponentCategory.EXTENSION,
nonVisible = true,
iconName = “https://ide.kodular.io/assets/logo.png”)

@SimpleObject(external = true)
public final class TestingColor1 extends AndroidNonvisibleComponent {

//private Button button;

public TestingColor1(ComponentContainer container) {
super(container.$form());
}
/* Coming Soon
@DesignerProperty(editorType = PropertyTypeConstants.PROPERTY_TYPE_COMPONENT)
@SimpleProperty
public void Button(Button button) {
this.button = button;
// do additional stuff to configure button…
}*/

// Purple Blocks are the function blocks. These blocks can only accept color blocks //

@SimpleFunction(description = “Sets Application to White”) // So this block would set the application to white //
public void SetLightTheme(int Color) {
// For this block I want the user to only set this block to “White” for now
}
@SimpleFunction(description = “Sets Application to Black”) // So this block would set the application to black //
public void SetDarkTheme(int Color) {
// For this block I want the user to only set this block to “Black” for now
}
@SimpleFunction(description = “Resets the apllication to default color”) // So this block would set the application to the default color //
public void SetDefaultColor(int Color) {
// For this block I want the user to only set this block to whatever the default background color was
}
}

Basically I have everything in a template for when the code goes in. I already have the these imported for changing background color. Posted below -----

import android.app.Activity;
import android.widget.RelativeLayout;
import android.graphics.Color;
import android.view.View;
import android.os.Bundle;
import android.widget.Button;

People keep saying its just like coding in java and so thats not a problem but every time I try typing java and implementing it into the code, errors seem to pile up.

So what im trying to understand is setting a function block to accepting 1 color, and when I press the button on the application, the background color will change to what I set it. For setting a background color, this is what I got so far —
setBackgroundColor(Color.parseColor("#01ff90"));

Thank you to those who helped me out so far. I greatly appreciate it. Im not begging or asking for code, just guidance because I want to learn the code without it being given to me all the time.

[jc1bryan (Lightning Kings)]

So far ive been reading this to help me out appinventor-sources/Canvas.java at master · mit-cml/appinventor-sources · GitHub

[yusufcihan]

People keep saying its just like coding in java and so thats not a problem but every time I try typing java and implementing it into the code, errors seem to pile up.

That’s true, App Inventor extensions are written in Java. However, App Inventor components are different and they have own special events/properties and methods.

For example; App Inventor doesn’t allow ArrayList objects as input parameter of method, it has own list object called YailList which used for all lists. There are some changes like this, but only objects, libraries… are little different, syntax and main libraries are still same as Java.

setBackgroundColor(Color.parseColor("#01ff90"));

And if you ever checked 3nportal AIBridge, you can find all methods, events and properties about all components in App Inventor.

http://3nportal.com/AIBridge/API/com/google/appinventor/components/runtime/Button.html

Button’s all methods are coming from ButtonBase:
http://3nportal.com/AIBridge/API/com/google/appinventor/components/runtime/ButtonBase.html

According to docs, there is no setBackgroundColor() in Button component. You can use BackgroundColor() method for setting background color of component. Using the method without any parameter will return color of button.

[jc1bryan (Lightning Kings)]

I understand that and I greatly appreciate the help but not background color of button, but of the screen. Any way I can change that? Because I want something where if you click a button the background color of the screen will change. Ive tried new code and got somewhere but this is the only piece im missing.

[hammerhai (Nathan)]

I think if you’d like to change the screen color, you’d have to do something like import form.java or something like that, I can’t give you an exact answer because I haven’t tried it, but maybe someone else can help.

Take a look at this better yet:

http://3nportal.com/AIBridge/API/com/google/appinventor/components/runtime/Form.html

[jc1bryan (Lightning Kings)]

Yeah im going through so many files and forums using git hub, app inventor community, thunkable community. Its not the code thats the problem its just the libraries and small things.

[Ken]

Maybe this will work?

How to set background color of an Activity to white programmatically?

[hammerhai (Nathan)]

The issue with the Stack Overflow link you listed, is that this is for Android Studio, and most likely unable to be done because of the findViewById(resId). As I said, the best way to do it would have to be using form.java, but there should be no libraries to build @jc1bryan, unless you’re using something that’s not in Kodular or another distribution. If that’s the case by any chance, you can tell us and we’ll be here to help

---

OK @jc1bryan I think I found an example for you below…

What you would have to do is import com.google.appinventor.components.runtime.Form; without any additional steps, place private final Form form; where the rest of your variables go, put this.form = container.$form(); under public ExtensionName(ComponentContainer container){}, and then for your block when to change the background color, form.BackgroundColor(int argb);

ARGB in Android is essentially 80 for half opacity then 0, 0, 0 for RGB. You can find the alpha codes here.

[jc1bryan (Lightning Kings)]

Thanks im trying this now as I was reading forum pages about .Form and background changing.

[hammerhai (Nathan)]

Look at this example for a better understanding…

Theme.java (1.3 KB)

[jc1bryan (Lightning Kings)]

Once again thanks for the help. I was doing so much research and reading and learned so much but putting it together was my main problem. I was even working on this during my college class. Anyway I added in the code and took out my old code. Code posted below.
~CODE~

package io.makeroid.jc1bryan_82242.ComingSoon;

import com.google.appinventor.components.annotations.DesignerComponent;
import com.google.appinventor.components.annotations.DesignerProperty;
import com.google.appinventor.components.annotations.PropertyCategory;
import com.google.appinventor.components.annotations.SimpleEvent;
import com.google.appinventor.components.annotations.SimpleFunction;
import com.google.appinventor.components.annotations.SimpleObject;
import com.google.appinventor.components.annotations.SimpleProperty;
import com.google.appinventor.components.annotations.UsesPermissions;
import com.google.appinventor.components.common.ComponentCategory;
import com.google.appinventor.components.common.PropertyTypeConstants;
import com.google.appinventor.components.runtime.AndroidNonvisibleComponent;
import com.google.appinventor.components.runtime.ComponentContainer;
import com.google.appinventor.components.runtime.Form;

@DesignerComponent(
version = 1,
description = “Extension made with Kodular IDE”,
category = ComponentCategory.EXTENSION,
nonVisible = true,
iconName = “https://ide.kodular.io/assets/logo.png”)

@SimpleObject(external = true)
public final class ComingSoon extends AndroidNonvisibleComponent {

public ComingSoon(ComponentContainer container) {
super(container.$form());
this.container = container;
this.context = container.$context();
this.form = container.$form();
}

private final Form form;
private int darkBackground = Color.argb(80, 0, 0, 0);
private ComponentContainer container;
private Context context;

// Purple Blocks are the function blocks. These blocks can only accept color blocks //
@SimpleFunction(description = “Sets Application to White”) // So this block would set the application screen to white //
public void SetLightTheme() {
form.BackgroundColor(darkBackground);
LightThemeActivated();
// For this block I want the user to only set this block to “White” for now
}
@SimpleEvent(description = “Coming Soon”)
public void LightThemeActivated() {
EventDispatcher.dispatchEvent(this, “LightThemeActivated”);
}

@SimpleFunction(description = “Sets Application to Black”) // So this block would set the application to black //
public void SetDarkTheme(int Color) {
// For this block I want the user to only set this block to “Black” for now
}
@SimpleFunction(description = “Resets the apllication to default color”) // So this block would set the application to the default color //
public void SetDefaultColor(int Color) {
// For this block I want the user to only set this block to whatever the default background color was
}

}
I ended up fixing all of my errors except for these

[jc1bryan (Lightning Kings)]

I just realized im missing

import com.google.appinventor.components.runtime.EventDispatcher;

Another issue popped up but I believe Im missing this

import android.graphics.Color;

because the debug log is saying cannot find symbol variable 'Color’

I believe I was also missing this because it said missing Class Context.

import android.content.Context;

[Ken]

Based on my previous post:

@SimpleFunction(description="Set Background Color")
  public void SetBackgroundColor(AndroidViewComponent component){
    // Get the View of a Visible Component 
    View v = component.getView();

    // Find the root View
    View root = v.getRootView();

    // Set the color
    root.setBackgroundColor(Color.GREEN);
  }

&

=

Note: The Screen’s background color must be transparent or you won’t be able to see the backgroundcolor of the rootview: