Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-25637] iOS: Window toolbar animates when opening window

GitHub Issuen/a
TypeBug
PriorityCritical
StatusClosed
ResolutionFixed
Resolution Date2018-01-17T16:47:07.000+0000
Affected Version/sn/a
Fix Version/sRelease 7.0.2
ComponentsiOS
LabelsIOS, Sliding, Toolbar, Window, iPhoneX, merge-7.0.2
ReporterThomas Neerup
AssigneeVijay Singh
Created2017-11-13T11:40:13.000+0000
Updated2018-01-24T23:05:23.000+0000

Description

When opening Windows in a NavigationWindow the toolbar on The window is animated sliding in from the bottom. Event the first window in the NavigationWindow slides in. Toolbars should not slide in when opening windows. When doing the same in Mail the toolbar does not slide in from the button, it just follows the window. Am I missing something? Is there some way to avoid all this sliding in? I have added a test case showing the sliding in of toolbars :) Thanks

Attachments

FileDateSize
iPhoneToolbarTest2.zip2017-11-13T11:33:31.000+00008648644
Screen Shot 2017-11-14 at 07.01.54.png2017-11-14T06:02:13.000+000028829

Comments

  1. Sharif AbuDarda 2017-11-13

    Hello, I tested your sample app. I am not sure what seems to be the issue here! Opening window is sliding from the right to left for me and toolbar at the bottom also slides from the right to left. What seems to be the issue here? Please elaborate. Thanks.
  2. Thomas Neerup 2017-11-14

    Hi Sharif.. I'm sorry it seems like it only happens on iPhone X I have added a screenshot ...
  3. Hans Knöchel 2017-11-14

    We don't reposition the toolbar manually, so this might either be a Simulator- or iOS-bug. Did you get in touch with Apple to report this issue so far? We reported quite a few tickets to them so far, with success (like with TIMOB-25269). Let us know, thanks!
  4. Sharif AbuDarda 2017-11-19

    Hello [~thomas.neerup@eg.dk], As Hans mentioned this might be iOS-bug. Did you try to get in touch with them?
  5. Thomas Neerup 2017-11-20

    Hi Sharif.. No I did not contact Apple. I would rather not be the man in the middle when I have no clue to how Appcelerator uses the native api's.
  6. Mostafizur Rahman 2017-11-29

    [~thomas.neerup@eg.dk], Thanks for your feedback. Hyperloop gives you direct access to the native APIs. Please follow the [link](https://docs.appcelerator.com/platform/latest/#!/guide/Hyperloop). Hope this helps. Best
  7. Hans Knöchel 2017-11-29

    [~thomas.neerup@eg.dk] No worries, we are taking care of it! I'll try to reproduce it on a native project and file an issue with Apple if it also occurs there.
  8. Hans Knöchel 2017-12-30

    Moving to TIMOB for closer investigation and comparison with native projects.
  9. Vijay Singh 2018-01-02

    [~thomas.neerup@eg.dk] Can you update index.xml and window.xml with following code and see if this solves your problem - index.xml - 
       <Alloy>
   	<NavigationWindow id="index" >
   		<Window class="container" onClick="doClick">
   			<Label text="Click to open window" ></Label>
   			<Toolbar bottom="0">
           <Items>
   				<Button id="send" title="Send" />
   				<Button id="camera" title="Camera" />
   				<Button id="cancel" title="Cancel" />
           </Items>
   			</Toolbar>
   		</Window>
   	</NavigationWindow>>
   
   </Alloy>
    window.xml - 
       <Alloy>
   	<Window id="window" class="container">
       <Toolbar bottom="0">
         <Items>
   			<Button id="send" title="Send2" />
   			<Button id="camera" title="Camera2" />
   			<Button id="cancel" title="Cancel2" />
         </Items>
   		</Toolbar>
   	</Window>
   </Alloy>
    You can see doc http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.Toolbar. Thanks!
  10. Vijay Singh 2018-01-03

    PR : https://github.com/appcelerator/titanium_mobile/pull/9698 Test Case - 
        var win1 = Ti.UI.createWindow({
        backgroundColor: 'white',
         toolbarSettings: {
             translucent: false,
             animated: false,
             barColor: 'red'
         }
    });
    
    var navWindow = Titanium.UI.iOS.createNavigationWindow({
      backgroundColor: 'white',
       window: win1
    });
    
    var btn = Ti.UI.createButton({
        title: 'Open Next Window'
    });
    btn.addEventListener('click', function() {
        navWindow.openWindow(getWindow(), {animated:true});
    });
    win1.add(btn);
    
    var button1 = Ti.UI.createButton({
        title: 'Button 1'
    });
    var button2 = Ti.UI.createButton({
        title: 'Button 2'
    });
    win1.setToolbar([button1, button2]);
    
    navWindow.open();
    
    function getWindow() {
        var win2 = Ti.UI.createWindow({
            backgroundColor: 'white',
            toolbarSettings: {
                translucent: false,
                animated: false,
                barColor: 'red'
            }
        });
    
        var close = Ti.UI.createButton({
            title: 'Close'
        });
        close.addEventListener('click', function() {
            win2.close();
        });
        win2.add(close);
    
        var button3 = Ti.UI.createButton({
            title: 'Button 3'
        });
        var button4 = Ti.UI.createButton({
            title: 'Button 4'
        });
        win2.setToolbar([button3, button4]);
        return win2;
    }
  11. Thomas Neerup 2018-01-03

    Hi Vijay Singh I have tried using the Toolbar instead of the WindowToolbar, and it semi works, the toolbar does not animate but I do not get the native look of the toolbar being extra tall on the iPhoneX.
  12. Hans Knöchel 2018-01-03

    [~thomas.neerup@eg.dk] I did the code-review for this ticket and tested it. Let me share a video I've just made that looked fine to me (iPhone X based): https://www.dropbox.com/s/n6haj1x8jfpn5va/iphone-x-toolbar.mov?dl=0
  13. Thomas Neerup 2018-01-03

    Hi Hans... The video shows the bug perfectly... The menu animates from the bottom up at the same time slides in from the side... That is not the intended animation... It should only slide in from the side... Like in the mail Mail app. when opening a mail . .
  14. Hans Knöchel 2018-01-03

    Hey Thomas! I was on the wrong branch / wrong video. It seems fine here: https://www.dropbox.com/s/i7tc74w35bqfkpg/iphone-x-toolbar-2.mov?dl=0 How did you patch your local source? The PR is not merged so far, so unless you patched it manually in ~/Library/Application Support, you either need to do that or wait for the 7.1.0 release.
  15. Thomas Neerup 2018-01-03

    Hi Hans... I'll take your word for it... I'll wait for 7.1.0
  16. Hans Knöchel 2018-01-03

    I'd love to see if it works for you already. Basically, go to: 
        ~/Library/Application Support/Titanium/mobilesdk/osx/7.0.1.GA/iphone/Classes/TiUIWindowProxy.m
    remove line 945: 
        [[controller navigationController] setToolbarHidden:!hasToolbar animated:YES];
    and re-insert it after 
        SETPROPOBJ(@"toolbar", setToolbar);
  17. Eric Merriman 2018-01-09

    [~vijaysingh] Please back port to 7.0.2. Thanks!
  18. Vijay Singh 2018-01-10

    PR (7_0_X) : https://github.com/appcelerator/titanium_mobile/pull/9713
  19. Abir Mukherjee 2018-01-12

    Passed FR.
  20. Abir Mukherjee 2018-01-24

    Verified fix is found in: SDK 7.0.2.v20180124113923 SDK 7.1.0.v20180124115505

JSON Source