iOS Tutorial How to add launch images in B4i

Status
Not open for further replies.

Erel

B4X founder
Staff member
Licensed User
Longtime User
Video or iPhone 4s launch image:



The image file is attached.

Note that the short black screen is not visible on a real device. It is only visible while recording the screen with AirPlay.
 

Attachments

  • Default@2x.png
    Default@2x.png
    3.5 KB · Views: 653
Last edited:

sorex

Expert
Licensed User
Longtime User
indeed, but you still have the black "page" between the red and actual app.

rebbug.png
 

sorex

Expert
Licensed User
Longtime User
that brings us to the question asked in several simular threads.

where is that coming from and why is it only be seen in B4i created apps?
 

Erel

B4X founder
Staff member
Licensed User
Longtime User
The black screen discussed in this thread: https://www.b4x.com/android/forum/threads/black-screen-at-app-start.59834/ is related to a missing launch image.

The very short black screen that you see in this video happens in the interval between the end of the launch image and the completion of the layout loading. Note that you will not see it on iPhone 5+ devices as they are quicker.

For further discussions please start a new thread.


There is no black screen at all when you run it without recording the video. The black screen is only visible for a very short moment when recording the screen with AirPlay.
 
Last edited:

sorex

Expert
Licensed User
Longtime User
I have been playing with this again and while the launch image is loading fine now I still get this status bar.

When placing some returns at several positions in the main sub I noticed that it's loadlayout command that brings back that status bar
even when Navigation Bar Visible & Navigation Toolbar Visible are not tagged in the designer
AND being disabled by code before the load layout.

I recoded parts of the CLAUStrophobia game to get rid of the delays between levels due to the slower image operations on 4S
and moved the optimization part to the start of the app. the result is now that I have this status bar for 1-2 seconds while it's disabled everywhere.

Could this be a minor bug in loadlayout that re-enables and again disables this status bar?
 

sorex

Expert
Licensed User
Longtime User
forgot to mention that the only way I seem to be able to reduce the visible status bar visibility is to trigger the "problem" sub with a timer of 500ms.
If the delay is smaller than 500ms the program isn't able to refresh the screen so the status bar is there for 3-4 seconds, now it's a bit less than 1 second
as the routine runs while the normal screen is already displayed. funny thing is that the click events are also ignore till the sub is done so that prevents errors when using stuff that are not created yet which is good.

I tried with callsub, callsubdelayed aswell but they seem to trigger immediatly which freezes the status bar look for 3+ seconds.

having no doevents can be a pain sometimes :)
 

sorex

Expert
Licensed User
Longtime User
yes, that's in release mode.

It appears that loadlayout sets default settings which enables the navbar/toolbar again,
creates the views in the layout
and then sets the navbar & toolbar settings defined in the layout.

I'll have a look at the CallSubPlus method aswell.
 

sorex

Expert
Licensed User
Longtime User
I confirm that this 'black hole of annoyance' as we call it on the chat is gone in the new beta :)
 

cloner7801

Active Member
Licensed User
Longtime User
B4i adds three white launch images for the following devices: iPhone 5s, iPhone 6 and iPhone 6+.
The reason for adding these specific images is that the app will run in a special backwards compatibility mode and will stretch the layout without them.

B4i apps start very quickly (start = the time it takes to the main NavigationController to display). So in most cases you don't really need to add any image (other than the three added automatically).

However if you do want to add or replace the white images, you should follow these steps:
1. To replace the three white images, you need to create three images with the following names and exact sizes and put them under Files\Special folder:
Default-568h@2x.png (640x1136) - iPhone 5s
Default-667h@2x.png (750x1334) - iPhone 6
Default-736h@3x.png (1242x2208) - iPhone 6+

If you want to add images for other devices then you need to modify the project template.
1. Close the IDE.
2. Edit B4iProject-Info.plist file. It is located in the installation folder under Project subfolder.
For example if we want to add an iPad image we should add the following text to this file (add it after the three existing dicts and before the closing </array>):
B4X:
<dict>
  <key>UILaunchImageMinimumOSVersion</key>
  <string>7.0</string>
  <key>UILaunchImageName</key>
  <string>Default-Portrait</string>
  <key>UILaunchImageOrientation</key>
  <string>Portrait</string>
  <key>UILaunchImageSize</key>
  <string>{768, 1024}</string>
  </dict>
3. Add the following two image files to Files\Special:
Default-Portrait.png (768 x 1024) - iPad non-retina
Default-Portrait@2x.png (1536 x 2048) - iPad retina

The size of iPhone 4s image is 640x960 and the image name is Default@2x.png.
The code for iPhone 4s is:
B4X:
<dict>
    <key>UILaunchImageMinimumOSVersion</key>
    <string>7.0</string>
    <key>UILaunchImageName</key>
    <string>Default</string>
    <key>UILaunchImageOrientation</key>
    <string>Portrait</string>
    <key>UILaunchImageSize</key>
    <string>{320, 480}</string>
  </dict>

In this video you can see a blue launch image on iPad:

How Can I delte this lunch images ? I create my lunchscreen with timer
 

Carlos marin

Active Member
Licensed User
Longtime User
B4i adds three white launch images for the following devices: iPhone 5s, iPhone 6 and iPhone 6+.
The reason for adding these specific images is that the app will run in a special backwards compatibility mode and will stretch the layout without them.

B4i apps start very quickly (start = the time it takes to the main NavigationController to display). So in most cases you don't really need to add any image (other than the three added automatically).

However if you do want to add or replace the white images, you should follow these steps:
1. To replace the three white images, you need to create three images with the following names and exact sizes and put them under Files\Special folder:
Default-568h@2x.png (640x1136) - iPhone 5s
Default-667h@2x.png (750x1334) - iPhone 6
Default-736h@3x.png (1242x2208) - iPhone 6+

If you want to add images for other devices then you need to modify the project template.
1. Close the IDE.
2. Edit B4iProject-Info.plist file. It is located in the installation folder under Project subfolder.
For example if we want to add an iPad image we should add the following text to this file (add it after the three existing dicts and before the closing </array>):
B4X:
<dict>
  <key>UILaunchImageMinimumOSVersion</key>
  <string>7.0</string>
  <key>UILaunchImageName</key>
  <string>Default-Portrait</string>
  <key>UILaunchImageOrientation</key>
  <string>Portrait</string>
  <key>UILaunchImageSize</key>
  <string>{768, 1024}</string>
  </dict>
3. Add the following two image files to Files\Special:
Default-Portrait.png (768 x 1024) - iPad non-retina
Default-Portrait@2x.png (1536 x 2048) - iPad retina

The size of iPhone 4s image is 640x960 and the image name is Default@2x.png.
The code for iPhone 4s is:
B4X:
<dict>
    <key>UILaunchImageMinimumOSVersion</key>
    <string>7.0</string>
    <key>UILaunchImageName</key>
    <string>Default</string>
    <key>UILaunchImageOrientation</key>
    <string>Portrait</string>
    <key>UILaunchImageSize</key>
    <string>{320, 480}</string>
  </dict>

In this video you can see a blue launch image on iPad:

Good morning guys, did any of this change over time? Today I tried to do the aforementioned, create the images according to the specified size and names, I left them in the files / Special folder but I continue seeing the annoying white screen every time I start my application, both in debug and release, I am making the tests on a real device (Iphone 6), if someone can help me remove this white initial or find a solution I appreciate it.
 
Status
Not open for further replies.
Top