Экран-заставка

  • Статья

Download Sample Скачайте пример

Приложение Android занимает некоторое время для запуска, особенно при первом запуске приложения на устройстве. Экран-заставка может отображать ход запуска пользователя или указывать фирменную символику.

Обзор

Приложение Android занимает некоторое время для запуска, особенно при первом запуске приложения на устройстве (иногда это называется холодным запуском). Экран-заставка может отображать ход запуска пользователя или отображать сведения о фирменной символии для идентификации и повышения уровня приложения.

В этом руководстве рассматривается один из способов реализации экрана-заставки в приложении Android. В ней рассматриваются следующие действия.

  1. Создание рисуемого ресурса для экрана-заставки.

  2. Определение новой темы, которая будет отображать ресурс, доступный для рисования.

  3. Добавление нового действия в приложение, которое будет использоваться в качестве экрана-заставки, определенного темой, созданной на предыдущем шаге.

Example Xamarin logo splash screen followed by app screen

Требования

В этом руководстве предполагается, что приложение предназначено для API Android уровня 21 или более поздней версии. Приложение также должно добавлять в проект пакеты Xamarin.Android.Support.v4 и Xamarin.Android.Support.v7.AppCompat NuGet.

Весь код и XML в этом руководстве можно найти в примере проекта SplashScreen для этого руководства.

Реализация экрана-заставки

Самый быстрый способ отрисовки и отображения экрана-заставки — создать настраиваемую тему и применить ее к активности, которая отображает экран-заставку. Когда действие отрисовывается, он загружает тему и применяет к фону действия ресурс, доступный для рисования (на который ссылается тема). Этот подход позволяет избежать необходимости создания файла макета.

Экран-заставка реализуется как действие, отображающее фирменное рисование, выполняет любые инициализации и запускает все задачи. После загрузки приложения действие экрана-заставки запускает основное действие и удаляется из стека обратного стека приложения.

Создание рисования для экрана-заставки

Экран-заставка будет отображать XML-рисунок в фоновом режиме действия заставки. Для отображения изображения необходимо использовать битовое изображение (например, PNG или JPG).

Пример приложения определяет вызываемый splash_screen.xml для рисования. Этот рисунок использует список слоев для центра изображения экрана-заставки в приложении, как показано в следующем xml:

<?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>
    <bitmap
        android:src="@drawable/splash_logo"
        android:tileMode="disabled"
        android:gravity="center"/>
  </item>
</layer-list>

Это layer-list центрит изображение заставки на цвет фона, указанный ресурсом @color/splash_background . Пример приложения определяет этот цвет в файле Resources/values/colors.xml :

<?xml version="1.0" encoding="utf-8"?>
<resources>
  ...
  <color name="splash_background">#FFFFFF</color>
</resources>

Дополнительные сведения об объектах Drawable см. в документации Google в Android Drawable.

Реализация темы

Чтобы создать настраиваемую тему для действия заставки, измените (или добавьте) значения файла /styles.xml и создайте новый style элемент для экрана-заставки. Пример значений/style.xml файла показан ниже с style именем MyTheme.Splash:

<resources>
  <style name="MyTheme.Base" parent="Theme.AppCompat.Light">
  </style>

  <style name="MyTheme" parent="MyTheme.Base">
  </style>

  <style name="MyTheme.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>  
    <item name="android:windowContentOverlay">@null</item>  
    <item name="android:windowActionBar">true</item>  
  </style>
</resources>

MyTheme.Splash очень спартан - он объявляет фон окна, явно удаляет заголовок из окна и объявляет, что он является полноэкранным. Если вы хотите создать экран-заставку, который эмулирует пользовательский интерфейс приложения, прежде чем действие раздувает первый макет, можно использовать windowContentOverlay вместо windowBackground определения стиля. В этом случае необходимо также изменить splash_screen.xml , чтобы он отображал эмуляцию пользовательского интерфейса.

Создание действия-заставки

Теперь нам потребуется новое действие для Android для запуска с изображением-заставкой и выполнение любых задач запуска. Следующий код является примером полной реализации экрана-заставки:

[Activity(Theme = "@style/MyTheme.Splash", MainLauncher = true, NoHistory = true)]
public class SplashActivity : AppCompatActivity
{
    static readonly string TAG = "X:" + typeof(SplashActivity).Name;

    public override void OnCreate(Bundle savedInstanceState, PersistableBundle persistentState)
    {
        base.OnCreate(savedInstanceState, persistentState);
        Log.Debug(TAG, "SplashActivity.OnCreate");
    }

    // Launches the startup task
    protected override void OnResume()
    {
        base.OnResume();
        Task startupWork = new Task(() => { SimulateStartup(); });
        startupWork.Start();
    }

    // Simulates background work that happens behind the splash screen
    async void SimulateStartup ()
    {
        Log.Debug(TAG, "Performing some startup work that takes a bit of time.");
        await Task.Delay (8000); // Simulate a bit of startup work.
        Log.Debug(TAG, "Startup work is finished - starting MainActivity.");
        StartActivity(new Intent(Application.Context, typeof (MainActivity)));
    }
}

SplashActivity явно использует тему, созданную в предыдущем разделе, переопределяя тему по умолчанию приложения. Не нужно загружать макет, OnCreate так как тема объявляет рисуемый в качестве фона.

Важно задать NoHistory=true атрибут таким образом, чтобы действие было удалено из стека назад. Чтобы предотвратить отмену процесса запуска кнопки "Назад", можно также переопределить OnBackPressed и сделать это не так:

public override void OnBackPressed() { }

Работа запуска выполняется асинхронно.OnResume Это необходимо, чтобы работа запуска не замедляла или не задерживала внешний вид экрана запуска. После завершения SplashActivity работы запустится MainActivity , и пользователь может начать взаимодействие с приложением.

Это новое SplashActivity задание в качестве действия средства запуска для приложения путем задания атрибута MainLaunchertrue. Так как SplashActivity теперь это действие средства запуска, необходимо изменить MainActivity.csи удалить MainLauncher атрибут из MainActivity:

[Activity(Label = "@string/ApplicationName")]
public class MainActivity : AppCompatActivity
{
    // Code omitted for brevity
}

Альбомный режим

Экран-заставка, реализованный на предыдущих шагах, будет отображаться правильно как в книжном, так и в альбомном режиме. Однако в некоторых случаях необходимо иметь отдельные экраны-заставки для книжных и альбомных режимов (например, если изображение-заставка является полноэкранным).

Чтобы добавить экран-заставку для альбомного режима, выполните следующие действия.

  1. В папке Resources/Drawable добавьте альбомную версию изображения экрана-заставки, которую вы хотите использовать. В этом примере splash_logo_land.png — это альбомная версия логотипа, которая использовалась в приведенных выше примерах (используется белое буквирование вместо синего).

  2. В папке Resources/drawable создайте альбомную версию layer-list рисования, которая была определена ранее (например, splash_screen_land.xml). В этом файле задайте путь растрового изображения к альбомной версии изображения экрана-заставки. В следующем примере splash_screen_land.xml использует splash_logo_land.png:

    <?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>
    <bitmap
        android:src="@drawable/splash_logo_land"
        android:tileMode="disabled"
        android:gravity="center"/>
  </item>
</layer-list>

  3. Создайте папку Resources/values-land , если она еще не существует.

  4. Добавьте файлы colors.xml и style.xml в хранилище значений (их можно скопировать и изменить из существующих значений/ colors.xml и значений/style.xml файлов).

  5. Измените значения -land/style.xml таким образом, чтобы он использовал альбомную версию рисуемого объекта windowBackground. В этом примере используется splash_screen_land.xml :

    <resources>
  <style name="MyTheme.Base" parent="Theme.AppCompat.Light">
  </style>
    <style name="MyTheme" parent="MyTheme.Base">
  </style>
  <style name="MyTheme.Splash" parent ="Theme.AppCompat.Light.NoActionBar">
    <item name="android:windowBackground">@drawable/splash_screen_land</item>
    <item name="android:windowNoTitle">true</item>  
    <item name="android:windowFullscreen">true</item>  
    <item name="android:windowContentOverlay">@null</item>  
    <item name="android:windowActionBar">true</item>  
  </style>
</resources>

  6. Измените значения -land/colors.xml , чтобы настроить цвета, которые вы хотите использовать для альбомной версии экрана-заставки. В этом примере цвет фона заставки изменяется на синий для альбомного режима:

    <?xml version="1.0" encoding="utf-8"?>
<resources>
  <color name="primary">#2196F3</color>
  <color name="primaryDark">#1976D2</color>
  <color name="accent">#FFC107</color>
  <color name="window_background">#F5F5F5</color>
  <color name="splash_background">#3498DB</color>
</resources>

  7. Выполните сборку и запуск приложения еще раз. Повернуть устройство в альбомный режим, пока экран-заставка по-прежнему отображается. Экран-заставка изменяется на альбомную версию:

    Rotation of splash screen to landscape mode

Обратите внимание, что использование экран-заставки в альбомном режиме не всегда обеспечивает простой интерфейс. По умолчанию Android запускает приложение в книжном режиме и перемещает его в альбомный режим, даже если устройство уже находится в альбомном режиме. В результате, если приложение запускается, пока устройство находится в альбомном режиме, устройство кратко представляет книжный экран-заставку, а затем анимирует поворот от портрета до альбомного экрана-заставки. К сожалению, этот первоначальный переход портрета в ландшафт происходит даже при ScreenOrientation = Android.Content.PM.ScreenOrientation.Landscape указании в флагах действия-заставки. Лучший способ обойти это ограничение — создать одно изображение экрана-заставки, которое правильно отображается как в книжном, так и в альбомном режиме.

Итоги

В этом руководстве рассматривается один из способов реализации экрана-заставки в приложении Xamarin.Android; а именно применение настраиваемой темы к действию запуска.