Android独特的闪屏：如何让它充满屏幕？

Question

我有一个独特的启动画面，名为 splash.png，大小为 1280x1280、150dpi 我在我的 React Native 项目中使用 react-native-bootsplash，但我认为这并不重要。

我的问题很简单：我怎样才能让我的启动画面在纵向模式下，全高，而不是更少，而不是更多，并保持其纵横比图片填满屏幕。 就像 css 中的 background-size: cover。 或者像 React Native 中的简单 <Image resizeMode="cover" style={{ height: '100%' }} />。

所以我有：

android/app/src/main/res/values/styles.xml

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:textColor">#000000</item>
    </style>

    <!-- BootTheme should inherit from AppTheme -->
    <style name="BootTheme" parent="AppTheme">
        <!-- set the generated bootsplash.xml drawable as activity background -->
        <item name="android:windowBackground">@drawable/bootsplash</item>
        <item name="android:windowNoTitle">true</item>
    </style>

</resources>

android/app/src/main/res/drawable/bootsplash.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
    <item>
      <!-- your logo, centered horizontally and vertically -->
      <bitmap
        android:layout_height="fill_parent"
        android:src="@drawable/splash"
        android:scaleType="centerInside"
        android:gravity="center" />
    </item>
</layer-list>

还有我的splash.pngandroid/app/src/main/res/drawable/splash.png

我尝试了很多东西，android:layout_height、android:scaleType 等等的很多组合，但我总是以飞溅图像的高度超出屏幕高度而告终。

[编辑] 这是初始图像，尺寸减小到足以使stackoverflow具有较小的尺寸

这是它在屏幕上显示的内容......

Answer 1

使用 Bitmap 的方法似乎没有成功。您对替代方案满意吗？

为您的 SplashActivity/-Fragment 使用如下布局怎么样？

显示 Appversion、支持联系人、进度等附加信息非常有用 - 这就是我个人更喜欢它的原因。

在 Kotlin 中使用 ViewModels 完成，您可能更了解 ReactNative。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
            android:id="@+id/iv_splash"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:scaleType="centerCrop"
            app:srcCompat="@drawable/splash"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

如您所见，centerCrop 是关键。它会剪切图像，但保留其纵横比。

现在在 SplashActivity 中扩展布局，您还可以让用户登录左右，然后在布局中显示结果，完成后切换到 MainActivity。

override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_splash)
    }

...或片段

override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        viewModel = ViewModelProvider.AndroidViewModelFactory(Application())
            .create(viewModel::class.java)
        return inflater.inflate(R.layout.fragment_splash, container, false)
    }

替代解决方案

如果您不打算在未来仅显示图像本身，则可以将其用作布局。

<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="centerCrop"
    app:srcCompat="@drawable/splash"/>

希望对你有帮助:)

Answer 2

对于带有背景图像填充的中心图像.. step1：在res中drawable里面创建一个Drawable资源文件 第二步：粘贴下面的代码，替换为背景图片作为您的图片和徽标

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/backgroundmapsneww"
    android:gravity="fill"
    />
<item
    android:height="100dp"
    android:width="100dp"
    android:gravity="center"
    android:drawable="@drawable/logo"
    >
</item>

Answer 3

我通过使用FrameLayout 和ImageView 完成了这项工作。在android/app/src/main/res/drawable/bootsplash.xml 中写下以下代码：

<FrameLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical"
>
  <ImageView 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:src="@drawable/splash" 
    android:scaleType="centerCrop" 
  />
</FrameLayout>

Answer 4

作为启动器主题实现的启动画面主要用于显示徽标而不是完整图像。您可以尝试为不同分辨率的图像进行九个补丁，使用这个网站：

http://ticons.fokkezb.nl/

上传您的图片（使用 3:4 纵横比，例如 1080x1920，以获得最佳效果）并选择 -> 飞溅。它将为您生成九个补丁图像，然后您需要将其上传到您的res/drawable-hdpi、res/drawalbe-mdpi、res/drawable-xhdpi、res/drawable-xxhdpi 和res/drawable-xxxhdpi 目录。如果它们还不存在，您可以创建它们。

上传九个补丁后这样使用：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <bitmap
        android:src="@drawable/background"
        android:gravity="fill" />
</item>
</layer-list>

使用您提供的图像，我能够获得合理的结果。让我知道，如果这有帮助。这是你能得到的最好的。其他选择是创建您自己的SplashActivity，它会在短时间内为您显示该图像。

Answer 5

我认为这里的关键是android:gravity="fill"。

当我在我的应用程序中实现它时，我遇到了同样的问题。

我的android/app/src/main/res/values/styles.xml

<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="android:textColor">#000000</item>
</style>
 <style name="BootTheme" parent="AppTheme">
<!-- set bootsplash.xml as background -->
<item name="android:background">@drawable/bootsplash</item>

还有我的android/app/src/main/res/drawable/bootsplash.xml

<?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" android:opacity="opaque">
    <item>
        <bitmap android:src="@mipmap/launch_screen" android:gravity="fill" />
    </item>
</layer-list>