Forum Xamarin.Android

Android Splash screen question

I need to display a splash screen on my Android app, but I need to have its proportions unchanged.

The tutorial shown on the Xamarin web site (http://docs.xamarin.com/guides/android/user_interface/creating_a_splash_screen) is using a style with a background image:

<resources>
  <style name="Theme.Splash" parent="android:Theme">
    <item name="android:windowBackground">@drawable/splash</item>
    <item name="android:windowNoTitle">true</item>
  </style>
</resources>

Unfortunatly, the image proportions are modified so it looks distorted on some screen resolutions.
It looks like the image is displayed with the FitXY parameter.
I would like the image to be scaled (liek fill_parent), but with its proportions unchanged (!fitXY)

How to achieve this?

Note : I tried to use different styles according to the device density (lp, hp, etc.) but it is not enough since this way I cannot handle all screen ratios.

Posts

  • CheesebaronCheesebaron DKInsider, University mod

    Background images in themes will always stretch to fit the view. Unless... You use this little hack:

    splashimage.xml

    <?xml version="1.0" encoding="utf-8"?>
    <bitmap xmlns:android="http://schemas.android.com/apk/res/android"
        android:src="@drawable/splash"
        android:tileMode="disabled" android:gravity="top" >
    </bitmap>
    

    Then:

    themes.xml

    <resources>
      <style name="Theme.Splash" parent="android:Theme">
        <item name="android:windowBackground">@drawable/splashimage</item>
        <item name="android:windowNoTitle">true</item>
      </style>
    </resources>
    

    This is grabbed from the following SO answer: http://stackoverflow.com/a/8501398/368379

  • KurtLangerKurtLanger USMember

    CheeseBaron,

    Thank you for your answer, but this is not what I need exactly.
    With your code, the image is not distorted (which is cool), but is displayed at size 1:1, i.e. not scale to fit the screen.
    What I need is simple, this is the default behavior of an image put in a layout, like this:

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:minWidth="25px"
        android:minHeight="25px">
        <ImageView
            android:src="@drawable/billabong_splash_320"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@+id/imageView1" />
    </LinearLayout>
    

    As you can see, this image is displayed with its proportion kept, but streteched to fit the screen. If the image ratio is not the same as the screen ratio, the black bands witll be dispalyed either at top/bottom of the screen, or at top/bottom of the screen.
    This is what I need, but in the splash screen.

  • CheesebaronCheesebaron DKInsider, University mod

    You can try play with the Gravity attribute. The different types you can use can be found here: https://developer.android.com/reference/android/view/Gravity.html

    Something like fill or fill_horiziontal might be what you are looking for.

  • How do create a splash screen that fade out when the activity fades in?

  • CheesebaronCheesebaron DKInsider, University mod
    edited February 2014

    @HashtagAndroid‌ you will need to look into how OverridePendingTransition works.

    Some more info in this StackOverflow question.

Sign In or Register to comment.