Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added: Add support for using image as background #3079

Open
wants to merge 11 commits into
base: master
Choose a base branch
from

Conversation

Kruna1Pate1
Copy link

@Kruna1Pate1 Kruna1Pate1 commented Nov 4, 2022

This changes allows the user to use an image as the terminal's background.

Background Image

To set an image as a background, open the context menu by long clicking on the terminal and select Menu -> Style -> Set background image.

To remove background image Menu -> Style -> Remove background image (It will also delete generated image files).

When an image is selected from the gallery, it is resized corresponding to device resolution and then compressed into a jpeg. Three image files, background.jpeg, background_portrait.jpeg, and background_landscape.jpeg are generated. The original source image is compressed into background.jpeg and can be used to regenerate portrait and landscape files in case of display size change or files get deleted.

Note: Resized images are center-cropped generated using ThumbnailUtils

Overlay Color

The overlay color is loaded from the termux.properties file with the key background-overlay-color. The default value is set to #59000000. To change the overlay color, add background-overlay-color=<color> to the termux.properties file. Supported color formats are #AARRGGBB and #RRGGBB. If the color is in #RRGGBB format then the alpha value of default color 0x59 (35%) is used.

Termux Settings

Background image loading can also be enabled/disabled from settings. From Termux Settings -> Termux -> Termux Style -> Background Image. If some malformed image is stored as background image and not letting open termux, then setting can be used to disable image loading.

Note: Disabling the image from the setting will not delete image files and can be restored.

Setting can also be used to temporarily disable image loading. You can enable it until and unless you delete image files from .termux/background folder.

Backup

Image files are stored in .termux/background folder, and overlay color value is stored in termux.properties and both are part of the backup, so you can easily Backup them.

However, the preference for background, whether it's image or color is stored and read from com.termux_preference.xml which is not part of the backup. The default value set for the background_image_enabled is false.

To overcome this issue, if background.jpeg is present, then the user can restore them. When again selecting an image from the gallery using Set background image, the alert is shown to restore images. If files for both orientation are present, It can also be done from the setting by enabling background image loading.

@ghost
Copy link

ghost commented Nov 4, 2022

Some feedbacks regarding this change, so far this feature works without issues how the way termux works and creates some terminal aesthetics. so far so good!
Landscape:
Screenshot_2022-11-05-01-16-45-48_84d3000e3f4017145260f7618db1d683

Portrait:
Screenshot_2022-11-05-01-16-33-26_84d3000e3f4017145260f7618db1d683

Although this is so far one of the things I've tried is setting the background. One minor things to address is toolbar transparency if it's feasible to fix? otherwise it's all good 👍

As per setting the color overlay. this works as to make texts readable on lighter backgrounds that would blend the text unreadable.

@Damaj301damaj-lol
Copy link

Some feedbacks regarding this change, so far the performance is very good and creates some terminal aesthetics. so far so good!
Landscape:
Screenshot_2022-11-05-01-16-45-48_84d3000e3f4017145260f7618db1d683

Portrait:
Screenshot_2022-11-05-01-16-33-26_84d3000e3f4017145260f7618db1d683

It would be cool if the bottom keys were also changed

@ravener
Copy link
Member

ravener commented Nov 4, 2022

Could the notch (aka the display cutout) also be filled in landscape?

@Kruna1Pate1
Copy link
Author

Working on toolbar transparency. Will commit once the proper code is changed.
Screenshot_2022-11-04-23-47-45-51_84d3000e3f4017145260f7618db1d683

@Kruna1Pate1
Copy link
Author

Kruna1Pate1 commented Nov 4, 2022

Could the notch (aka the display cutout) also be filled in landscape?

No, currently it's not filling cutout on landscape orientation. Will see what can be done.

It can be done but, will look like this:

Screenshot-2022-11-05-00-06-44-99-84d3000e3f4017145260f7618db1d683

Screenshot-2022-11-05-00-13-14-48-84d3000e3f4017145260f7618db1d683

@ghost
Copy link

ghost commented Nov 5, 2022

I think leaving the notch as is would be better, considering not all devices have notch and the transparency would be enough to fill the gap to make the background consistent in the terminal.

@ravener
Copy link
Member

ravener commented Nov 5, 2022

I think leaving the notch as is would be better, considering not all devices have notch and the transparency would be enough to fill the gap to make the background consistent in the terminal.

Yeah nevermind, Termux is not fully full screen so that looks a bit odd

@ghost
Copy link

ghost commented Nov 5, 2022

The extra keys toolbar transparency works like a charm!
Screenshot_2022-11-05-19-40-19-88_84d3000e3f4017145260f7618db1d683
I tested CTRL, ESC, TAB and PG keys and it works as intended!

@kyzsuukii
Copy link

I tried this feature on my device and it doesn't work
the background doesn't change and looks messed up on the text

Screenshot_2022-11-07-13-28-01-986_com termux

Screenshot_2022-11-07-13-28-43-778_com termux

@Kruna1Pate1 Kruna1Pate1 force-pushed the background-image branch 2 times, most recently from 4be45f6 to 2b88003 Compare November 7, 2022 05:52
@Kruna1Pate1
Copy link
Author

I tried this feature on my device and it doesn't work the background doesn't change and looks messed up on the text

can you check if background files are generated properly at .termux/background.jpeg and .termux/background_landscape.jpeg

What is the status in setting, is the switch enabled at Termux Settings -> Termux Style -> Background Image enabled

@kyzsuukii
Copy link

I tried this feature on my device and it doesn't work the background doesn't change and looks messed up on the text

can you check if background files are generated properly at .termux/background.jpeg and .termux/background_landscape.jpeg

What is the status in setting, is the switch enabled at Termux Settings -> Termux Style -> Background Image enabled

perfectly available

Screenshot_2022-11-07-14-11-48-706_bin mt plus canary

@kyzsuukii
Copy link

i try again from action. i think its fixed
but still have same issue

Screenshot_2022-11-07-16-57-28-114_bin mt plus canary
Screenshot_2022-11-07-16-56-03-627_com termux
Screenshot_2022-11-07-16-55-40-383_com termux

@Kruna1Pate1
Copy link
Author

i try again from action. i think its fixed but still have same issue

Fixed the issue,
PorterDuff.Mode.MULTIPLY was causing the issue. For Android > 9 BlendMode filter is used, that's why it was working fine for android > 9.
Now changed to PorterDuff.Mode.DARKEN which seems to work pretty fine.

@JohannesMolla
Copy link

It amazing feature thank you man

@Kruna1Pate1
Copy link
Author

@Kruna1Pate1 friend Transparent theme like Windows Terminal when ?

@rihaq Actually, I have implemented it. But, there are several issues with it. To make an Activity transparent, Activity needs to be Translucent.

But, it leads to android:screenOrientation set to unspecified. Which means it chooses orientation from background activity. And most launchers are fixed to portrait.

Another problem is, the method to change Activity from opaque to translucent and vice-versa was added in API 30 "setTranslucent(boolean)". For API <= 29, I can't find a proper way to change it programmatically.

It might create problems for Android 8 devices, because of this Prevent non-fullscreen activities from influencing orientation which was fixed in Android 8.1.

Will see if this can be figured out. Also, it looks a little bit uncomfortable on Android. Maybe playing with some alpha value and blur effect can help.

ss


Please add TIOCGWINSZ #3002

I am not much familiar with Terminal code, But will see if I can help there.

@KitsunedFox
Copy link

KitsunedFox commented Nov 15, 2022

Here's a suggestion: You could implement background blur along with transparent background that works on Android <11 with RealtimeBlurView lib. (suggesting mine because official one is very outdated and doesn't build anymore)

And then, it would look like just as windows' cmd blur

But of course, there would be some performance impact, so this could be an optional setting

@Kruna1Pate1
Copy link
Author

Here's a suggestion: You could implement background blur along with transparent background that works on Android <11 with RealtimeBlurView lib. (suggesting mine because official one is very outdated and doesn't build anymore)

I tried it (on Android 12 btw). Looks pretty cool with the blur effect. But as I said have to make the activity translucent which causes some trouble. (Can't make it optional because changing it dynamically is added in API 30 as I said).


But of course, there would be some performance impact, so this could be an optional setting

Yes, I have noticed that causing some performance drawbacks.

@tareksander
Copy link
Member

But as I said have to make the activity translucent which causes some trouble. (Can't make it optional because changing it dynamically is added in API 30 as I said).

What I'd do for these cases is have 2 Activities that only differ in the translucency, and make the launcher icon start an invisible helper Activity that starts the translucent or opaque Activity depending on the setting. When you make the original Activity a base class it should be possible without much code duplication. I don't know if Termux can manage having 2 terminal activities, and changing the setting would have to finish the old Activity, so there aren't 2 at the same time.

@Kruna1Pate1
Copy link
Author

I will try to do that. and i think new pr would be better for this since many changes would require.

@ezra-1
Copy link

ezra-1 commented Dec 8, 2022

Can't find the set background option

@Kruna1Pate1
Copy link
Author

Make sure to download from GitHub Action build.

@Damaj301damaj-lol
Copy link

@Kruna1Pate1 friend Transparent theme like Windows Terminal when ?
windows-terminal-acrylic-transparent-background
?

Use Termux:Float for this

@Damaj301damaj-lol
Copy link

Screenshot_20221211-165436_One UI Home.png

@Damaj301damaj-lol
Copy link

@Kruna1Pate1 friend Transparent theme like Windows Terminal when ?
windows-terminal-acrylic-transparent-background
?

Use Termux:Float for this

Says the one using Vanced 😂 (I also have it installed for emergency purpose but I use revanced)

No I won't use float shit

then write it yourself

@Damaj301damaj-lol
Copy link

@Kruna1Pate1 friend Transparent theme like Windows Terminal when ?
windows-terminal-acrylic-transparent-background
?

Use Termux:Float for this

Says the one using Vanced 😂 (I also have it installed for emergency purpose but I use revanced)
No I won't use float shit

then write it yourself

Shut up its not telegram. Behave. Be civilised

Hold up what, you should be the person getting this advice

@cattokomo
Copy link

It would be cool if there's an alpha option

@Kruna1Pate1
Copy link
Author

It would be cool if there's an alpha option

That what "Overlay Color" is mentioned in PR i guess.

@cattokomo
Copy link

It would be cool if there's an alpha option

That what "Overlay Color" is mentioned in PR i guess.

When it will be push?

@aicynide
Copy link

I will try to do that. and i think new pr would be better for this since many changes would require.

Patiently waiting for your pr 🤗

@aicynide
Copy link

I can see in the OP screenshot, keyboard is also transparent. How?

@muttaqin1
Copy link

Hello,
i am new in termux and i want to change my termux background.I am not understanding how everyone is changing their background. Can you please tell me the full process of installing termux so that i can change my termux background.

@Damaj301damaj-lol
Copy link

Hello,
i am new in termux and i want to change my termux background.I am not understanding how everyone is changing their background. Can you please tell me the full process of installing termux so that i can change my termux background.

This ain't the place to learn fam, its in beta, its also unrecommended, so instead use the stable one and wait for this to get pushed

@cattokomo
Copy link

Hello, i am new in termux and i want to change my termux background.I am not understanding how everyone is changing their background. Can you please tell me the full process of installing termux so that i can change my termux background.

It's better to stick with stable version of Termux. If you still want that background support badly, you can grab it from artifacts.

@anirov
Copy link

anirov commented May 3, 2023

Unfortunately, builds with background image support are no longer available for download in GitHub Action build
Please, if possible, re-upload (or share, in this way)

Kruna1Pate1 and others added 11 commits May 4, 2023 00:03
 This method allows to launch an Activity for result.
The `ImageUtils` class includes utility functions for image manipulation and storage.
It provides functions for loading bitmap or drawable, storing, resizing and compressing images.
`getIntColorFromString()` can be used to get an int color by parsing the string color. Color can be in the form of `#AARRGGBB` or `#RRGGBB`.

`swap()` can be used to exchange x and y value present in `Point`.
This change allows the user to use an image as the terminal's background.

Add option to select or remove the background image in the context menu -> style.

`TermuxBackgroundManager` holds the responsibility of making background changes. It provides functionalities:
- Change the background color.
- Set or remove the background image.
- Selecting an image from the gallery.
- Restore the image if available.
- Notify about the changes made to the background.

`updateBackgroundColor()` is moved from `TermuxTerminalSessionActivityClient` to `TermuxBackgroundManager`.

Images are stored in the termux data home directory. The image is resized corresponding to the display resolution and compressed before saving.

Background overlay color is read from the `termux.properties` file with the key `background-overlay-color`. The default value is set to `#59000000`.

To change the background overlay color, add `background-overlay-color=<color>` to `termux.properties` file. Supported color formats are `#AARRGGBB` or `#RRGGBB`.
The user can enable or disable background image loading from the termux setting available in `Termux Style` preferences with this commit.
If some malformed image is stored as background, disable image loading in the setting.
Disabling the image from the setting will not delete image files and can be restored.
Change comment for landscape background from `background.jpeg` to `background_landscape.jpeg`.
… the preference

Set overlay color to the `TerminalToolbarViewPager` background when the image is background. And set the `ExtraKeysView` button to transparent.

If the background is color, then set it to the default value.
Add `TERMUX_BACKGROUND_DIR_PATH` and `TERMUX_BACKGROUND_DIR` to store background images.
Use `TERMUX_BACKGROUND_IMAGE_PATH` and `TERMUX_BACKGROUND_IMAGE_FILE` to store original compressed image.
Change `TERMUX_BACKGROUND_IMAGE_PORTRAIT_PATH` and `TERMUX_BACKGROUND_IMAGE_PORTRAIT_FILE` to store portrait image.
Compress to jpeg and store original image to `TERMUX_BACKGROUND_DIR`.

Use `Activity` size instead of display size.

If portrait and landcape files are deleted or `Activity` size is changed, then regenerate images using original image.
For Android <= 9, `PorterDuff.Mode.MULTIPLY` causing unusable screen lag. Change to `PorterDuff.Mode.DARKEN`.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet