Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ios page.showModal platform inconsistancies & bugs #781

Closed
NathanaelA opened this issue Sep 19, 2015 · 9 comments
Closed

ios page.showModal platform inconsistancies & bugs #781

NathanaelA opened this issue Sep 19, 2015 · 9 comments
Assignees
Milestone

Comments

@NathanaelA
Copy link
Contributor

  1. By default on Android it will show a title bar; by default on iOS their is no title bar.
  2. On Android you can can change the title bar by declaring an ActionBar and settings it title. This does not work on iOS, still no title bar present.
  3. On iOS the only way to get a title is to create a small layout variation to have a
    wrapped in a or (so you have to add two or more additional elements to the layout to have a title on iOS).
  4. By default on both iOS and Android fullScreen parameter is not working (well it is consistently broken to act like it is true on both platforms). I did put a bug report in ShowModal in v1.3 #748 which I have figured out how to fix Android; but I have not bothered to dig into iOS (and probably won't). -- Patch This fixes the issue with the android Dialogs  #726 has a fix for this.

5. When you pull up the keyboard on ios it covers most of a dialog; I do believe the proper behavior is for the screen to scroll up so the fields are in focus and visible. At least it behaves properly on Android. #782

@hamorphis
Copy link
Contributor

On iOS, the fullScreen=false mode is available only on iPads. iPhones ignore fullScreen=false and show the dialog on the entire screen since their displays are small and there is nothing we can do to force Apple change this.

@NathanaelA

This comment was marked as abuse.

@hamorphis
Copy link
Contributor

That is normal. When you set the height of the Layout, it becomes as high as you want. Its parent, which you don't see takes up the whole screen.

@vchimev
Copy link
Contributor

vchimev commented Sep 23, 2015

I confirm issue 1. that in v.1.3.0 page.showModal shows a title bar on Android, but it should not. Also I confirm with reference to issue 4. that in v.1.3.0 fullScreen=false: does not work properly on Android, works as expected on iPads and is not expected to work on iPhones as @hamorphis explained.

@NathanaelA

This comment was marked as abuse.

@N3ll N3ll added this to the 1.5 (Under Review) milestone Oct 12, 2015
@hamorphis hamorphis self-assigned this Oct 19, 2015
@hamorphis hamorphis removed their assignment Oct 19, 2015
@hshristov hshristov self-assigned this Oct 20, 2015
@hshristov
Copy link
Contributor

@NathanaelA I've fixed all issues so now it should be consistent.

  1. No matter what you set as actionBarHidden it always stays hidden.
  2. As of 1.4 we are using NavigationBar for iOS so it is not possible (at least not without a lot of changes) to show it in modal page that is why we always hide it in android (in android we are using Toolbar)
  3. For the moment this is the recommended and cross platform way - to create a layout and place a label in it. If you think showing full blown ActionBar is needed please log a different issue.
  4. fullScreen is now working as expected in android. On iOS - we sets the correct native parameter but iPhone doesn't respect it and always show the page in full screen. Only iPad do. I think this is some UX decision that could change in later iOS version.
  5. There is a nice plugin - https://github.com/tjvantoll/nativescript-IQKeyboardManager

Closing this issue for now. Open it if there is something I have missed.

@rajivnarayana
Copy link

Workaround for 1.

I created a toolbar plugin for other things but I was able to extend it to mimic a navigation bar on iOS https://github.com/rajivnarayana/nativescript-toolbar#modal-screens. Has xml just like an action bar with support for tap events on items as well.

<Page xmlns="http://schemas.nativescript.org/tns.xsd" 
    xmlns:tools="nativescript-toolbar">
  <DockLayout stretchLastChild="false">
    <tools:ToolBar dock="top" barPosition="3">
        <tools.ToolBar.barItems>
            <tools:ToolBarItem text="Done" tap="onDoneButtonTapped" />
        </tools.ToolBar.barItems>
    </tools:ToolBar>
  </DockLayout>
</Page>

Add style="margin-bottom:0.5" attribute to allow the line below the toolbar to be not cut off when you have other elements like list-view below it.

@yss14
Copy link

yss14 commented Oct 11, 2016

Is there a possibility to show the ActionBar on a modal view?
@rajivnarayana linked a nice workaround for ios but I need the ActionBar or NavigationBaron both platforms...

@lock
Copy link

lock bot commented Aug 29, 2019

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

@lock lock bot locked and limited conversation to collaborators Aug 29, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

7 participants