Remove or change graphic of InputField target graphic

Question

I am working on a game in Unity and I have to use an InputField but I would like it to not have a border. Currently it has a black border with a border radius that needs to go.

Through my initial searching, I came across this question and thought I found the answer to my problems.

However, I cannot seem to change or remove this TargetGraphic. If I use the button to the right to pick a new one and set it to none, it just reverts right back to the default graphic. It doesn't accept images and I even tried to set the target graphic programmatically but it didn't work.

This is the current look of the input, you can see the black border.

I also tried (without really hoping for much) to set it like so:

public InputField inputField;

void Start()
{
    inputField = GetComponent<InputField>();
    inputField.targetGraphic = null;
}

Answer 1

Unity provides a default set of image assets. If you set the targetGraphic to null, then it will take the default UI shader, which is why you will see an entirely white patch where your InputField is located.

The default image (32x32), which is provided by Unity, has a black border around the image. If you want to not have a border, then you will have to import your own image, and use that, or you can try to add a few UI effects to get another effect if you want.

When you add an image to Unity, make sure that the image is set as Sprite (2D and UI) in the inspector. You can not use textures in the Source Image of the Image component. If your project was created with the 3D template, then the default setting is set to texture rather than Sprite.

Also, you may be trying to drag and drop the new image into the Target Graphic property of the InputField component. The InputField component take an image target. The same GameObject will have another component which is called Image. You want to change the Source Image of this component.