Have you created a Fluid component yet? Have you tested it on mobile? What did you see? Did it work as expected? When I created my first Fluid component, what surprised me was the zoom factor. My mobile device rendered Fluid content as if it were Classic. Sure, it had nice big Fluid buttons, but my mobile browser zoomed out so much that I thought I was looking at Classic, not Fluid. My first question was, "Why? Why is it doing that?" Without contrary instruction, a mobile browser will scale to fit a page. You would think a responsive page would scale accordingly, but it doesn't. It scales at large form factor, which is zoomed out. My next question was, "Isn't Fluid mobile?" Actually, Fluid has the potential to be mobile, but no. Fluid by itself is not mobile. The Fluid framework seems to be missing the meta Viewport tag, the tag that tells a mobile browser how to scale content. So how do we set the Viewport? At its core, we set the Viewport using the AddMetaTag PeopleCode function, and you are welcome to use it, but I don't recommend it. Instead, use PT_PAGE_UTILS:Utils.SetDefaultViewport. This App Class method handles the Viewport meta tag for us, including known operating-system issues. With that said, a basic Fluid component without a Flex grid is fully mobile if we set the Viewport. So is Fluid mobile? The correct answer is Fluid + PeopleCode = Mobile.
With which event should we invoke SetDefaultViewport? I've seen it in a lot of PageActivate code, but let's think about that for a minute... every time you switch between pages within a single component, PeopleSoft invokes PageActivate. Do we need to call SetDefaultViewport with every page change? No, just once per component. Meta tags exist in the head section of the rendered HTML, downloaded on the first component load, and subsequently updated upon request. So which event then? I prefer component PreBuild. Either PreBuild or PostBuild will work just fine. PostBuild triggers after the component buffer loads and usually contains a lot of component buffer manipulation logic. Setting the meta tag has no impact on the component buffer, and I hate to clutter a messy PostBuild with unrelated PeopleCode 😉.
How does Oracle handle this meta-issue? Any new component uses PT_PAGE_UTILS:Utils.SetDefaultViewport almost exclusively in one of those three events: PageActivate, PreBuild, or PostBuild. But if you review original Fluid components (early HCM, for example), you will find a mixture of AddMetaTag and SetViewPort Function library calls.
Setting the Viewport is a fundamental principle we teach in our Fluid Basic (Fluid 1) course. Checkout fluid.jsmpros.com to see when we are offering it next. Would you prefer to learn at your own pace? We cover this topic in our one-day on-demand training course Fluid Basic Development. Or, purchase the Fluid 1 Bundle and save! Do you have a group of developers to train? Contact us for special group pricing!
No comments:
Post a Comment