Directivas iónicas VS Directivas de material angular con Ionic Framework

98

Quiero usar ionic con material design. Estoy atrapado entre el uso de directivas iónicas con CSS personalizado y material angular

He leído que al usar directivas iónicas obtenemos muchas características eficientes como

  • Los datos de la aplicación se recuerdan con UI-router, incluso después de navegar a otra vista y volver a la página.

  • Los elementos de la lista iónica se representan solo para mostrar la altura y se reutilizan al desplazarse hacia arriba o hacia abajo

y muchas mejoras de rendimiento.

Pero, si uso directivas iónicas, no tienen el diseño del material.

Si utilizo material angular, no tendré estas mejoras de rendimiento ni las funciones adicionales necesarias para una aplicación móvil.

Las directivas de material angular son como

<md-list>
  <md-item ng-repeat="item in items">
    Hello, {{item}}!
  </md-item>
</md-list>

Las directivas iónicas son como 

<ion-list>
  <ion-item ng-repeat="item in items">
    Hello, {{item}}!
  </ion-item>
</ion-list>

Parece que Ionic está financiando el desarrollo de proyectos de material angular , entonces, ¿por qué el material angular no es compatible con iónico?

¿Cómo puedo usar componentes de material angular sin perder las mejoras de rendimiento y las características de ionic?

O

¿Existe una mejor idea para usar material design con ionic?

javascript angularjs ionic-framework ionic2 material-design Vamsi
fuente
Probablemente tomará algún tiempo, hasta que ngMaterial e ionic funcionen entre sí. Ionic siempre tiene que ser compatible con iOS también. No estoy seguro de hacia dónde se dirige Ionix en cuanto al diseño. Cuando comenzó el proyecto, querían que las aplicaciones se vieran idénticas en todas las plataformas. Lograron ese objetivo hace algún tiempo y ahora se dirigen hacia una mayor continuidad de la plataforma, lo que también se muestra en la publicación del trabajo. Es posible que desee preguntar directamente a los desarrolladores (el foro Ionic es un buen lugar para preguntar) sobre la hoja de ruta para el diseño de materiales.
Markus Müller
1
He publicado en foros iónicos, sin suerte. Algunas de las aplicaciones de Google utilizan material design tanto en Android como en iOS. Pero actualmente estoy interesado en Android. iOS es más costoso y cada año :(. Simplemente desalienta a los principiantes como yo a unirse a ios. Creo que ios debería usar un cargo limitado para la cuenta de desarrollador.
Vamsi
Estoy seguro de que anunciarán la hoja de ruta de la publicación v1 en un futuro próximo.
Markus Müller

Respuestas:

71

Encontré un marco CSS de diseño de materiales conocido como Materializecss . Parece prometedor. Es simplemente un marco CSS y javascript simple.

http://materializecss.com/

Ventajas sobre otros marcos

  1. Las clases de CSS puro no entrarán en conflicto con las directivas iónicas. Sin pérdida de rendimiento.
  2. De todos los frameworks que he visto, este es el único que sigue de cerca las reglas de diseño de materiales.
  3. Casi listo, tiene más de 50 colaboradores, su versión actual 0.95.3 en menos de 6 meses
  4. Fácil de usar. Bien documentado con navegación inteligente.
  5. Tiene casi todas las características de diseño de materiales necesarias para una aplicación.

Esta página http://materializecss.com/getting-started.html le mostrará cómo incluirlo en sus proyectos.

Espero que esto ayude a cualquiera de ustedes que busque un buen marco de diseño de materiales.

ACTUALIZACIÓN: 2015-07-09

Encontré otro marco CSS hermoso, ligero y poderoso para diseño de materiales

Material Design Light http://www.getmdl.io/

Es ligero, tiene animaciones suaves y rápidas, y se ve bastante bien. Fue creado por uno de los desarrolladores de Google. Google lo promueve oficialmente https://developers.google.com/web/ . Se está volviendo bastante popular, pruébalo. Comparación con material angular

ACTUALIZACIÓN: 2015-10-23

Ionic2 tiene soporte InBuilt para diseño de materiales en Android

Es oficial, puedes ver la demostración de Ionic2 en AngularConnect , tiene Material Design por defecto para Android. No tenemos que preocuparnos por elegir un marco de diseño de materiales.

Vamsi
fuente
1
El gran problema con esto es que necesita jQuery
darryn.ten
1
Solo necesitamos el css. Popup's, modales y otras características existen en ionic. Por lo tanto, jquery no es necesario en su mayoría a menos que estemos tratando de utilizar materializar características de javascript que no están en iónico.
Vamsi
¿Tiene algún comentario sobre el uso de Material Design Light getmdl.io? Estoy aquí con el mismo problema y pregunta sobre el diseño de material iónico +. Así que agradecería mucho cualquier comentario sobre la biblioteca
Javier Salinas
No lo he usado personalmente Material Design Light, parece prometedor. Aquí está la comparación de tutorialzine.com/2015/07/comparing-bootstrap-with-mdlMaterial Design Light y , si ha utilizado bootstrap, le ayudará. Google promociona esto en su página de desarrollador web. Entonces, debe ser lo suficientemente bueno. bootstrap
Vamsi
25

Hay un proyecto bastante nuevo llamado Ionic Material .

Lo probé y funciona bastante bien, pero tenga en cuenta que todavía está en modo "Vista previa previa al lanzamiento".

Según el repositorio de github , debería ingresar a Alpha en abril de 2015.

Se puede instalar con bower

bower install ionic-material

Eso es prácticamente todo lo que necesita hacer, pero tenga cuidado, hay errores y la documentación es básicamente inexistente.

¡Buena suerte!

darryn.ten
fuente
9
He visto la biblioteca de material iónico antes, pero el problema es 1. Esto no está cerca de completarse. No hay documentación disponible. 2. Esto no está en desarrollo activo y no tiene un buen soporte. solo un hombre trabajó en él durante 7 días como se ve hoy. Por lo tanto, es difícil usarlo en la aplicación de producción sin garantía. 3. Angular-material, ionic ambos tienen buena financiación y soporte y muy buenos desarrolladores están trabajando en ello, a buen ritmo. para que pueda confiar en ellos.
Vamsi
3

Ionic Material y Ionic Material Design Lite son dos nuevas bibliotecas que apuntan a ser una extensión del marco iónico. Aunque es un poco inmaduro, funciona bien con componentes iónicos y apoya bien la temática del material.

Esto probablemente podría dar una idea más clara.

varna
fuente