I added a splash screen to my Android app by using an XML drawable as a window background inside the theme.
<style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
<item name="android:windowBackground">#drawable/splash_screen_drawable</item>
</style>
Here is the code for the drawable:
<item
android:drawable="#color/white"/>
<item>
<bitmap
android:gravity="center"
android:src="#drawable/splash_screen_icon"/>
</item>
I need the splash screen to continuously be shown even after the second activity was loaded because it first needs to load some data from firebase. That's why I added the same drawable to the parent view of the second activity.
The problem I face is that the icon on the splash screen is aligned slightly higher than in the second activity, even though I used:
android:fitsSystemWindows="true">
Is there an easy way to fix this problem?
Related
In my Splash Screen, I have an image that spreads all over the screen and because of this, the image is not looking good - like it got stretched.
I wanted to fix this by adding "android:height" attribute to the Splash Screen style and change the image height but the image remains stretched.
Apparently, the android:height attribute is affecting all of the views that inside the layout that related to the Splash Screen
This is my style for the splash screen:
<style name="splashScreenTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">#mipmap/app_icon</item>
<item name="android:height">100dp</item>
</style>
Any ideas on why android:height affect the layout views and not the Splash Screen image?
note:
I saw this question talking about different images for different screen sizes, but the difference is that I don't want the image to spread all over the screen.
You using <item name="android:height">100dp</item> for root view of the Activity. Its not instance of View class, it smth else. And you cant set height for it, Activity should match available area.
To fix stretched image, try this. Set background not a bitmap, but the drawable
<style name="splashScreenTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">#drawable/shape_background_splash</item>
</style>
and create this drawable
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#android:color/white"/>
<item>
<bitmap
android:gravity="center"
android:src="#mipmap/app_icon"/>
</item>
</layer-list>
if you have a bitmap for all scales it should looks good
I'm trying to use a 9-patch image as a splash screen, but I get a weird artefact when doing so.
I use the following style on the activity
<style name="AppTheme.Splash" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">#drawable/splash_screen</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowFullscreen">true</item>
</style>
This references the following drawable
<?xml version="1.0" encoding="UTF-8" ?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<color android:color="#color/splash_background" />
</item>
<item>
<nine-patch
android:src="#drawable/test_splash"
android:tileMode="disabled"
android:gravity="center" />
</item>
</layer-list>
The 9-patch image has two scalable vertical regions---above and below "Middle". There is no horizontal scaling set.
What this ends up giving me is
Where is that black bar 3/4 of the way down coming from?
I had the same issue. After scrubbing thru all of my splash.9.png files looking for the problem, I retreated and tried one that worked fine in another app. It produced the same artifact.
It seems the issue is with the Theme.AppCompat.Light.NoActionBar. Try this instead:
<style name="splashscreen" parent="android:Theme">
It doesn't look exactly the same around the title bar and such, but it looks like a splash screen.
I don't use Xamarin (I use Titanium), but I had this exact problem when I didn't provide a padding box (the black pixels on the right and bottom). I fixed it by filling the padding lines with black.
Based on this tutorial and this answer, which also references this other tutorial, using a theme's android:windowBackground along with a <layer-list/> appears to be the most approved method of creating an Android Splash Screen
Using this technique centering a logo on screen is easy; however, I want to position graphics along the top or bottom of the screen. I've run into problems because, as seen in the screenshot below, the windowBackground appears to be drawn behind both the Status Bar at the top of the screen and the Navigation Bar at the bottom thus making the graphics appear cut-off
Question: Is it possible to instruct the windowBackground to position itself below the Status Bar and above the Navigation Bar? If not, using the windowBackground Splash Screen technique is it possible to create a splash screen that isn't covered by the Status Bar or Navigation Bar?
To reproduce the problem, create a new Android Studio project which will get you the ic_launcher drawable and follow one of the tutorials linked above but use the following layer-list drawable
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
android:opacity="opaque">
<item android:drawable="#000000"/>
<item>
<bitmap
android:gravity="left|top"
android:src="#drawable/ic_launcher"/>
</item>
<item>
<bitmap
android:gravity="center"
android:src="#drawable/ic_launcher"/>
</item>
<item>
<bitmap
android:gravity="bottom"
android:src="#drawable/ic_launcher"/>
</item>
</layer-list>
You may set windowDrawsSystemBarBackgrounds to false in your theme for lollipop and higher versions.
Example:
res/values-v21/styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="Theme.Splash">
<item name="android:windowBackground">#drawable/splash</item>
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
</style>
</resources>
I am building an application to show a dynamic picture and a dialog with a button. The thumbnail of that picture is then used as the background of the button. However, if the picture is with black pattern, it turns out showing as "holo" and transparent to the background. This makes the button ugly.
I am trying this on android 4.x.
I have tried using different themes for the dialog, Theme.Dialog, Theme.Holo and Theme.Light but no luck.
My problems are
(1) how to make a non-holo button with DiaglogFragment(even on a holo theme view/activity).
(2) is this related to android versions? or machines?
Thank you.
you need to create a selector with all the different states of a button and for each state you will need an image
for example
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/blue_curve" android:state_enabled="true" android:state_pressed="false"/>
<item android:drawable="#drawable/blue_curve_pressed" android:state_pressed="true"/>
</selector>
then set the background to the selector in your xml
I want to have custom background for the menu items displayed in the ActionBar. I found out that I can do that by adding the following item to my app theme style definition:
<item name="android:actionBarItemBackground">#drawable/actionbar_button</item>
Where actionbar_button.xml contains:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/action_btn_on" android:state_pressed="true" />
<item android:drawable="#drawable/action_btn_off" />
</selector>
However, this causes the background image to also render behind the custom app logo displayed on the left of the ActionBar. After several attempts at figuring out a selector that would include only the buttons, I came up with this:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/action_btn_on" android:state_pressed="true" android:state_enabled="true" />
<item android:drawable="#drawable/action_btn_off" android:state_pressed="false" android:state_enabled="true"/>
<item android:drawable="#android:color/transparent"/>
</selector>
Which sort of worked, and after the app loads fully the background behind the logo is transparent as I want it. But the problem is that while it's still loading it briefly shows the logo with the button background behind it and more annoyingly, it scales and crops the logo to fit inside the fill area of the 9-patch graphic that is the button background. When finished loading, the background is switched out, but the scaling and cropping remains, which looks quite ugly. How can I fix it?
Have not found a working solution to the general problem of setting image-based backgrounds to ActionBar buttons, but the scaling/cropping does not happen if I use entered XML based backgrounds, such as created with a layer-list of shapes. For some cases in may not be viable, but in my case it was entirely possible, and maybe even better than using a bitmap based resource.