iOS 13 ante portas

September 19th is the release date for iOS 13 on iPhones and September 30th for iPadOS.

I understood you are working on a new major release of Framework7 adopting some styles like probably the new popover look and feel? Any chance this will be released before those dates?

You can already grab latest v5 beta. It has it all and I think it is a pretty solid now in terms of production ready.

And try beta of new F7 icons v3 beta. It has collection of SF ones

Thanks. I tried but rolled back, because it looks like there is much to change on my side as well. Therefore, I’m going to wait for the official release and the updated documentation :wink:

I made some screenshots while testing. One folder containing the current state and the other using the 5.0 beta and 3.0 icons. Hope it is somewhat useful. It is mainly about the navigation bar:

https://holtwick.de/download/20190911-125302-f7-ios.zip

Can you show HTML of any of those pages?

Воспользуюсь моментом: https://github.com/framework7io/framework7/blob/v5/CHANGELOG-v5.md спасибо, это просто здорово (что есть такой changelog)!

1 Like

Sure. Vue code follows.

This is the popup with the missing navbar and close button:

<template>
<f7-popup class="popup-icloud">
    <f7-view
    :push-state="false"
    :master-detail-breakpoint="0"
    >
    <f7-page>
        <f7-navbar>
        <f7-nav-left>
            <f7-link
            @click="doClose"
            icon-ios="f7:close"
            icon-md="f7:close">
            </f7-link>
        </f7-nav-left>
        <f7-nav-title>Apple iCloud Drive</f7-nav-title>
        </f7-navbar>
        <icloud @close="doClose"></icloud>
    </f7-page>
    </f7-view>
</f7-popup>
</template>

And this is the Settings page:

<template> 
<f7-page>
    <f7-navbar back-link title="Settings">     
    </f7-navbar>
    <div>...</div>
</f7-page>
</template>

Hope it helps.

@shastox Thanks for the Changelog.

Did you also update framework7-vue to same v5 beta?

Oops, how embarrassing. I did not. Now the UI looks great again. Just some icons look different, but the fix should be easy. Thanks for your patience.

Yeah, check the cheat sheet in icons repository for new icons reference

Maybe some icon alias names would be nice, changes I noticed:

  • “close” is now “multiply” or “xmark”
  • “share” is now “square_arrow_up”

Not very self explaining. I wonder why Apple has chosen such strange names.

Well, they choose actually to name them by what is literally displayed there )) I also found it not very comfortable and it is not what we get used to. But a bit later after I used them a bit I really quick get used to it and it easier to search them now))

I didn’t go with aliases because in current implementation it will be easier to maintain them and keep on consistency with SF

I see and understand the motivation.

But I guess I will not be the only one who needs to touch code just because of updating to icons v3 :wink: Maybe you should describe some frequent mappings in the release notes then. At least for those that are accessible inside the iOS cosmos via semantic names: https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/system-icons/