如何在 React Native 中为 IOS 创建带有全屏图像的 LaunchScreen,该屏幕与 iPad 和所有 iPhone 兼容

2023-12-10

我需要一个我的启动屏幕上的全屏图像使用 React Native 构建 IOS 应用程序。我已经推荐了不同的帖子,但大多数都解释了中间带有徽标的启动屏幕,但没有一个对适合所有设备分辨率(包括 iPad)的全屏启动图像给出正确的解释。

我创建了一个带有 View 和 Imageview 的 LaunchScreen.xib 文件,如下所示,但它在 iPad 中损坏,但在某种程度上适合 iPhone(尽管它也有一些适合高分辨率 iPhone 的黑色阴影)

<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="15400" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" colorMatched="YES">
    <device id="retina5_5" orientation="portrait" appearance="light"/>
    <dependencies>
        <deployment identifier="iOS"/>
        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="15404"/>
        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
    </dependencies>
    <objects>
        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
        <view contentMode="scaleAspectFit" id="iN0-l3-epB">
            <rect key="frame" x="0.0" y="0.0" width="414" height="716"/>
            <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
            <subviews>
                <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="Default" id="IGQ-OV-TUd">
                    <rect key="frame" x="0.0" y="-10" width="414" height="736"/>
                    <autoresizingMask key="autoresizingMask" flexibleMinX="YES" widthSizable="YES" flexibleMaxX="YES" flexibleMinY="YES" flexibleMaxY="YES"/>
                </imageView>
            </subviews>
            <color key="backgroundColor" red="0.30980392156862746" green="0.42745098039215684" blue="0.47843137254901957" alpha="1" colorSpace="calibratedRGB"/>
            <nil key="simulatedStatusBarMetrics"/>
            <modalPageSheetSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
            <point key="canvasLocation" x="-20.289855072463769" y="107.60869565217392"/>
        </view>
    </objects>
    <resources>
        <image name="Default" width="682.66668701171875" height="910.66668701171875"/>
    </resources>
</document>

我在下面附上我的 View 和 ImageView 的设置屏幕截图

enter image description here

enter image description here

我为三种不同的比例创建了 3 个虚拟图像,其 Content.json 如下所示

{
  "images" : [
    {
      "idiom" : "universal",
      "filename" : "Dummy.png",
      "scale" : "1x"
    },
    {
      "idiom" : "universal",
      "filename" : "[email protected]",
      "scale" : "2x"
    },
    {
      "idiom" : "universal",
      "filename" : "[email protected]",
      "scale" : "3x"
    }
  ],
  "info" : {
    "version" : 1,
    "author" : "xcode"
  }
}

所有上述更改都没有为我的要求提供适当的解决方案。我想知道是否需要为所有可能的设备创建全屏图像并将它们包含在 Content.json 文件中。但是我应该在设置中给出什么宽度和高度(Scrrenshots)

有人请帮助我为我的要求提供正确的解决方案。


enter image description here

只需要将上、左、右、下的约束设置为0即可。这将自动适合所有设备。

这是我的 LaunchScreen.xib 的代码

<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="15400" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" colorMatched="YES">
    <device id="retina6_1" orientation="portrait" appearance="light"/>
    <dependencies>
        <deployment identifier="iOS"/>
        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="15404"/>
        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
    </dependencies>
    <objects>
        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
        <view contentMode="scaleToFill" id="iN0-l3-epB">
            <rect key="frame" x="0.0" y="0.0" width="376" height="480"/>
            <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
            <subviews>
                <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="Ios" translatesAutoresizingMaskIntoConstraints="NO" id="mAG-fl-dgj">
                    <rect key="frame" x="0.0" y="0.0" width="376.00000000000023" height="480"/>
                </imageView>
            </subviews>
            <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
            <constraints>
                <constraint firstItem="mAG-fl-dgj" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" id="4Qq-Mv-2hX"/>
                <constraint firstItem="mAG-fl-dgj" firstAttribute="top" secondItem="iN0-l3-epB" secondAttribute="top" id="5G1-V8-uL4"/>
                <constraint firstAttribute="trailing" secondItem="mAG-fl-dgj" secondAttribute="trailing" id="61P-7a-W4I"/>
                <constraint firstAttribute="bottom" secondItem="mAG-fl-dgj" secondAttribute="bottom" id="b3b-rs-eay"/>
            </constraints>
            <nil key="simulatedStatusBarMetrics"/>
            <freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
            <point key="canvasLocation" x="472.46376811594206" y="454.6875"/>
        </view>
    </objects>
    <resources>
        <image name="Ios" width="788" height="1400"/>
    </resources>
</document>

如果您想添加自定义启动屏幕,您可以在中手动创建 通过创建一个单独的组件来创建你的 React 应用程序。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 React Native 中为 IOS 创建带有全屏图像的 LaunchScreen,该屏幕与 iPad 和所有 iPhone 兼容 的相关文章

  • iOS - UITableViewCell 使文本加粗

    我有一个字符串 NSString userInfo James Johnson james 我想做的就是大胆James Johnson并保留 james正常字体 所以我尝试过的是使用NSAttributedString但为了完成这个过程 我
  • 将 UIToolBar 添加到所有键盘(swift)

    我正在尝试以尽可能少的重复次数将自定义 UIToolBar 添加到我的所有键盘中 我目前的做法要求我将代码添加到所有 viewDidLoads 中 并将每个文本字段的委托分配给我正在使用的 viewController 我尝试创建自己的 U
  • 如何检测用户是否第一次打开应用程序[重复]

    这个问题在这里已经有答案了 是否可以检测用户是否是第一次打开iOS应用程序 使用Objective C 我想在用户第一次打开应用程序时显示欢迎消息 但之后不再向他们显示 我正在寻找类似的东西 BOOL firstTime AppDelega
  • Xcode 9:“clang:错误:生成多个输出文件时无法指定 -o”

    我刚刚将 Xcode 更新到版本 9 并且在编译时开始收到以下错误消息 该问题似乎与将 优化级别 参数设置为 无 即 O0 进行编译有关 如果我将其设置得更高 错误就会消失 但是当我增加优化时 调试工具将无法正常工作 例如变量跟踪 我查看了
  • nlohmann/json 框架中的未知断点

    一段时间以来 当我在启用断点的 Xcode 下运行我的应用程序时 我显然在名为 nlohmann basic json 的系统框架中遇到了一个未知断点 我可以毫无问题地继续执行 但这无论如何都很烦人 知道这个断点的原因是什么 或者更好的是
  • Flutter 应用程序在 iOS 平台的 firebase 电话身份验证中崩溃

    我在我的项目中实现了 Firebase Phone auth 在 Android 端 一切正常 但对于 iOS 端 当我尝试从我的端发送验证码时 应用程序崩溃并失去连接 我已在下面提交了我的代码 主程序 dart class MyApp e
  • SwiftUI 意外地自动弹出 NavigationLink

    我有一个简单的用例 其中一个屏幕使用 NavigationLink 推送另一个屏幕 iOS 14 5 有一个奇怪的行为 即推送的屏幕在被推送后立即弹出 Code NavigationLink destination EmptyView Em
  • 有没有办法在 Firebase 中等待查询完成?

    我正在使用 TableView 在 Viewcontroller 中的 iOS 应用程序中进行查询 我想确保在继续加载 TableView 之前我的查询已经返回 有没有办法保证查询已经完成 None
  • 将类型传递给通用 Swift 扩展,或者理想情况下推断它

    说你有 class Fancy UIView 你想找到所有兄弟姐妹Fancy意见 没问题 https stackoverflow com q 37232743 294884 for v UIView in superview subview
  • Swift:长按手势识别器 - 检测轻击和长按

    我想连接一个动作 如果手势是点击 它会以特定的方式为对象设置动画 但如果按下持续时间超过 0 5 秒 它会执行其他操作 现在 我刚刚连接了动画 我不知道如何区分长按和点击 如何访问新闻持续时间以实现上述目的 IBAction func ta
  • iOS 7 tabBar 横线,如何去掉?

    Apple 在 iOS 7 中的 tabBar 上添加了一条细线 该线应该在 tabBar 和 UI 之间起到阴影或淡入淡出的作用 由于我使用的是定制的 tabBar 这条线非常令人恼火 你如何删除它 请告诉我这是可能的 否则我需要重新设计
  • React Native:相机流的多个预览

    我有一个要在 Android 和 iOS 中开发的 React Native 应用程序 我想在其中获取相机流 进行一些处理 然后多次渲染它 想象一下像 Instagram 这样的应用程序 您可以在其中实时向相机添加滤镜 并在实时预览中显示应
  • 使用 UITabBarController 时覆盖整个屏幕的视图?

    我想在 UITabBarController 设置中在整个屏幕上覆盖 HUD 样式的透明图形 执行此操作的按钮位于第一个选项卡的屏幕 FirstViewController 中 并且覆盖层也应该覆盖选项卡 这可能吗 您可以将新视图直接附加到
  • GLKit的GLKMatrix“列专业”如何?

    前提A 当谈论线性存储器中的 列主 矩阵时 列被一个接一个地指定 使得存储器中的前 4 个条目对应于矩阵中的第一列 另一方面 行主 矩阵被理解为依次指定行 以便内存中的前 4 个条目指定矩阵的第一行 A GLKMatrix4看起来像这样 u
  • UICollectionView setLayout:animated: 不保留 zIndex

    我注意到打电话时setLayout animated in a UICollectionView要在两个布局之间切换 当前可见的单元格不遵循zIndex它的布局属性已设置在layoutAttributesForItemAtIndexPath
  • 詹金斯配置文件问题

    检查依赖关系 找不到与 Nitin xxxxxxx xyzCAppStore 匹配的 iOS 配置文件 Xcode 找不到与 Nitin xxxxxxx xyzCAppStore 匹配的配置文件 安装配置文件 通过将其拖放到 Xcode 的
  • 带动态元素的 WPF 启动屏幕。如何?

    我是 WPF 新手 我需要一些帮助 我有一个加载缓慢的 WPF 应用程序 因此我显示启动屏幕作为权宜之计 但是 我希望能够在每次运行时更改屏幕 并在文本区域中显示不同的引言 这是一个生产力应用程序 所以我将使用非愚蠢但激励性的引言 当然 如
  • UIViewController 内的 UIsearchController 使用自动布局

    有没有人成功实施过UIViewController其中包含两个UISearchController searchBar and a UItableView使用自动布局来布局所有内容 我正在尝试实现类似的目标1密码 https itunes
  • 上传存档错误:“缺少 iOS 发行版签名身份......”

    我正在尝试使用 Xcode 将我的 iOS 应用程序存档上传到 iTunes Connect 但是当我单击 上传到 App Store 时 出现错误 Xcode 尝试查找或生成匹配的签名资产并 由于以下问题未能做到这一点 缺少 iOS 为
  • 如何上传 React Native 的 Firebase Crashlytics 映射文件?

    我在用rnfirebase io https rnfirebase ioFirebase Crashlytics 堆栈跟踪是模糊的 如何上传映射文件来查看原始源代码 是否有 API 或 SDK 支持 None

随机推荐