Polymer: Creating responsive UIs

Показать описание

Designing your UI so it works across multiple screen sizes is no longer a nice to have, it is *the* way to build for the web. Using Polymer, we'll cover how to create robust, responsive elements that work across all platforms.

Рекомендации по теме

Комментарии

*I/O Byte: Polymer: Creating Responsive UIs*
/by #iobytes #polymer

Designing your UI so it works across multiple screen sizes is no longer a nice to have, it is *the* way to build for the web. Using Polymer, we'll cover how to create robust, responsive elements that work across all platforms.

GoogleDevelopers

Excellent example! Usually, the examples given for new(ish) technologies are banal examples. At least here you are doing something practical and useful. Good work!

sfincione

But you still have to set a fixed width? Or can you calculate this dynamically?

anna

Can I use polymer 3.0 to develop iOS native applications without Cordova

ravikirangajula

Hmm, the two links at the end to the other videos don't seem to work?

chrisdhanaraj

I don't understand how the author adding the custom element will know what the element will do when it reaches the max of 500px? Is an attribute of "query" explicit enough so that the author/designer knows how the element will react at different screen sizes? Shouldn't there be more done to ensure that there is consistency across different devices, is letting the author define the breakpoint the best option?

gavinmcfarland

... nice.. what about css media queries? how change style (not template) based on the media query?

mattia.astorino

I've tried to use the given example, but I can't get this to work. Can someone dumb this down for me? I'm obviously doing something wrong.

countmegabaron

Well, I wish there was a text version for this video. The problem nowadays is that there're way too many videos. They are really not the most efficient way to document stuff. People can read tons of documents in the time span of a video.

catx

please update <iron-media-query query></iron-media-query> is what is currently in use. So for example: <iron-media-query query="min-width: 992px"

manuelaullo

I thought going with normal Media Query is easier than this Polymer Core Media query.

Techhysahil

"make them responsive by default"
the web is responsive by default

JAlbertBowden

Polymer: Creating responsive UIs

Polymer: Creating responsive UIs

Polymer Tutorials #8 - Installing & Using Core Elements

Adaptive UI with Material Design and Paper Elements (The Polymer Summit 2015)

Polymer: Building Blocks for the Web

Polymer Tutorials #9 - Core Layout Elements Part 1

Polymer Tutorial - How To Use Polymer JS

Building UI at Enterprise Scale with Web Components (Polymer Summit 2017)

Introduction to Polymer: The Next Generation of Web Development - Matthew McNulty

Using Polymer to Build Mobile Web Apps - Eugene Oksman and Akhilesh Gupta

Polymer Tutorials #13 - Easy Material Effects

Using Polymer 1.0 (development patterns)

Polymer Tutorials #11 - Layout Attributes

Polymer: making Web Components accessible

'My First Polymer 1.0 Webpage'

Polymer Tutorials #3 - Creating Our First Element

Let’s build some apps with Polymer! - Chrome Dev Summit 2014 (Rob Dodson)

Building Progressive Web Apps with Polymer

Page layouts in Polymer 1.0

Building an Element in Polymer 2: Basic Polymer Conversion (Part 3 of 5)

Develop UI with Google Polymer Using uikindle.herokuapp.com

Cosmos Briefing: The Polymer Brush Solution

Web components with Polymer

Get Started With Polymer: Introduction

Creating custom elements with Polymer 1.0