[SailfishDevel] Non full-screen SilicaWebView

Artem Marchenko artem.marchenko at gmail.com
Wed Dec 4 10:11:44 UTC 2013


Thanks Raine

Great to have a discussion with the component developers happening :)

As for right now, I did use the header property as a quick fix and it
indeed works. Not 100% as I want it, but well enough for now. The main
thing that's not good enough with it is that header is scrolled out when
you start browsing to the bottom of the page while I'd like the Search
field to stay always visible.

I was thinking more about this situation and the more I think about it the
more I come to conclusion that your implementation is actually good except
that it breaks the single responsibility principle.

**Full screen flickable**
It's not a bad idea to have a utility SilicaFlickableWebView or whatever
would be the well sounding name for just creating a usable full screen view
easily. Such a Flickable would care about, well, all things full screen
such as making sure the Back navigation icons are always in a good
contrast. Right now they look quite bad in emulator if the page is white.

**Just a wrapper**
But then there should just a webkit wrapper class somewhere that would let
you interact, well, with a web content. Use cases that come to mind
instantly:
- Getting a title of a page to, well, title the Silica Flickable
  - And other meta data such as favicon or OpenGraph image for representing
page in the bookmarks (okay currently WebView provides icon only)

- Web-related service controls such as loadHtml() and reload()

- And actually everything else that's available via Qt WebView :)

Best regards,
Artem.


On Wed, Dec 4, 2013 at 11:05 AM, Raine Mäkeläinen <ravalt at gmail.com> wrote:

> Hi Artem,
>
> First of all, thanks for the feedback regarding SilicaWebView. We try to
> tackle them when going forward.
>
> What comes to SilicaWebView we have an undocumented "header" property that
> could be used in your case. As it is undocumented we cannot guarantee that
> it stays like it is now.
>
> "property Component header"
>
> Page {
>     SilicaWebView {
>         anchors.fill: parent
>         url: "http://en.m.wikipedia.org"
>         header: SearchField {
>             width: parent.width
>             placeholderText: "Search"
>             EnterKey.onClicked: {
>                 // Do search
>             }
>         }
>
>         PullDownMenu {
>             MenuItem {
>                 text: "2nd"
>             }
>
>             MenuItem {
>                 text: "1st"
>             }
>         }
>     }
> }
>
> Hope this helps,
> -Raine
>
>
> On Thu, Nov 28, 2013 at 1:32 AM, Artem Marchenko <
> artem.marchenko at gmail.com> wrote:
>
>> Hi all
>>
>> Not sure if it's a question, a bug report or a feature request :)
>>
>> **Context**
>> I am making a Wikipedia app, go download the current version from store
>> or build from https://github.com/amarchen/Wikipedia
>>
>> And UI makes a lot of sense [to me] if it has a Search bar always visible
>> on the top of the page. No problem, I used to put there a SearchField and
>> anchor WebView to below it. Until use of WebView was forbidden and we had
>> to switch to SilicaWebView.
>>
>> **Problem**
>> SilicaWebView seems to be engineered so that it is always full screen (as
>> any other Flickable) and it is not behaving well if included into another
>> Flickable.
>>
>> To be precise two Flickables seem to start fighting over touch control
>> and scrolling sometimes works, sometimes doesn't :/
>>
>> **Possible solutions (as I see it)**
>> 1. Downgrade SilicaWebView to be just a wrapper for a web view, don't mix
>> Flickable responsibilities into WebView responsibilities. There are
>> different responsibilities after all.
>>
>> 2. Or extract just a WebView wrapper into a new class
>>
>> 3. Or resolve the situation when SilicaWebView is not a full screen item,
>> but lives inside another Flickable.
>>
>> What do you think?
>>
>> Best regards,
>> Artem.
>>
>> --
>> Artem Marchenko
>> http://agilesoftwaredevelopment.com
>> http://twitter.com/AgileArtem
>>
>> _______________________________________________
>> SailfishOS.org Devel mailing list
>>
>
>
> _______________________________________________
> SailfishOS.org Devel mailing list
>



-- 
Artem Marchenko
http://agilesoftwaredevelopment.com
http://twitter.com/AgileArtem
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.sailfishos.org/pipermail/devel/attachments/20131204/3a35a92d/attachment.html>


More information about the Devel mailing list