对于那些对Ionic应用程序开发完全陌生的人来说,了解项目背后的核心理念,概念和工具可能会有所帮助。下面介绍Ionic Framework的基础知识。

  UI组件

  Ionic Framework是一个UI组件库,它是可重用的元素,用作应用程序的构建块。Ionic组件是用网络标准使用HTML,CSS和JavaScript。虽然这些组件是预先构建的,但它们是从头开始设计的,可以高度自定义,因此应用程序可以将每个组件都自己制作,从而使每个应用程序都拥有自己的外观和感觉。更具体地说,Ionic组件可以轻松地主题化,以在整个应用程序中全局更改外观。

  平台连续性

  平台连续性是Ionic Framework的内置功能,允许应用程序开发人员在多个平台上使用相同的代码库。每个Ionic组件都会将其外观调整为运行应用程序的平台。例如,IOS设备(如iPhone和iPad)使用Apple自己的iOS设计语言。同样,Android设备使用Google的设计语言Material Design。
通过在平台之间进行细微的设计更改,用户可以获得熟悉的应用体验。从IOS的App Store下载的Ionic应用程序将获得iOS主题,而从Android Play商店下载的Ionic应用程序将获得Material Design主题。对于从浏览器中被视为渐进式Web应用程序(PWA)的应用程序,Ionic将默认使用Material Design主题。此外,决定在某些场景中使用哪个平台是完全可配置的。

  导航

  传统的网络应用程序使用线性历史记录,这意味着用户可以向前导航到某个页面,并可以点击后退按钮进行导航。这方面的一个例子是点击百度,用户在浏览器的线性历史堆栈上前进和后退。
相比之下,移动应用程序通常使用并行的“非线性”导航。例如,选项卡式界面可以为每个选项卡分别设置导航堆栈,确保用户在导航和切换选项卡时不会失去位置。
Ionic应用程序采用这种移动导航方法,支持也可以嵌套的并行导航历史,同时保持Web开发人员熟悉的浏览器式导航概念。
对于使用Angular构建的应用程序@ionic/angular,建议使用Angular Router,用于每个新的Ionic 4 Angular应用程序。Ionic的早期版本附带我们自己的定制路由器,但为了提供最佳的工具和开发人员体验,我们已经转向使用框架推荐的路由器。

  本机访问

  使用网络技术构建的应用程序(例如Ionic应用程序)的一个惊人功能是它几乎可以在任何平台上运行:台式电脑,手机,平板电脑,汽车,冰箱等等!Ionic应用程序的相同代码库可以在许多平台上运行,因为它基于Web标准和跨这些平台共享的通用API。
Ionic最常见的用例之一是构建一个可以从App Store和Play Store下载的应用程序。iOS和Android软件开发工具包(SDK)均提供“Webview“它可以渲染任何Ionic应用程序,同时仍允许完整的 Native SDK访问。
像Capacitor和Cordova这样的项目通常用于为Ionic应用程序提供对Native SDK的访问权限。这意味着开发人员可以使用常见的Web开发工具快速构建应用程序,并且仍然可以访问本机功能,例如设备的加速计,摄像头,GPS等。

  主题化

  在Ionic核心,Ionic Framework的样式是使用CSS构建的,它允许我们利用CSS属性(变量)提供的灵活性。这使得设计一个看起来很棒的应用程序非常容易,同时遵循Web标准。我们提供一组颜色,以便开发人员可以拥有一些很棒的默认值,但我们鼓励覆盖它们以创建所需调色板相匹配的设计。从应用程序的背景颜色到文本颜色的所有内容都可以完全自定义。

Ionic 4 核心概念的更多相关文章

  1. Angular核心概念

    一.集成开发环境@angular/cli IE8之后才有debugger工具 2009,nodejs发布,前端Big Bang 1.1 基于NodeJS的工具链 打包工具 grunt 对js代码做合并 ...

  2. 领域驱动设计(DDD)部分核心概念的个人理解

    领域驱动设计(DDD)是一种基于模型驱动的软件设计方式.它以领域为核心,分析领域中的问题,通过建立一个领域模型来有效的解决领域中的核心的复杂问题.Eric Ivans为领域驱动设计提出了大量的最佳实践 ...

  3. Javascript本质第一篇:核心概念

    很多人在使用Javascript之前都至少使用过C++.C#或Java,面向对象的编程思想已经根深蒂固,恰好Javascript在语法上借鉴了Java,虽然方便了Javascript的入门,但要深入理 ...

  4. [程序设计语言]-[核心概念]-02:名字、作用域和约束(Bindings)

    本系列导航 本系列其他文章目录请戳这里. 1.名字.约束时间(Binding Time) 在本篇博文开始前先介绍两个约定:第一个是“对象”,除非在介绍面向对象语言时,本系列中出现的对象均是指任何可以有 ...

  5. spring技术核心概念纪要

    一.背景 springframework 从最初的2.5版本发展至今,期间已经发生了非常多的修正及优化.许多新特性及模块的出现,使得整个框架体系显得越趋庞大,同时也带来了学习及理解上的困难. 本文阐述 ...

  6. ElasticSearch学习笔记-01 简介、安装、配置与核心概念

    一.简介 ElasticSearch是一个基于Lucene构建的开源,分布式,RESTful搜索引擎.设计用于云计算中,能够达到实时搜索,稳定,可靠,快速,安装使用方便.支持通过HTTP使用JSON进 ...

  7. Playmaker Input篇教程之引入的核心概念

    Playmaker Input篇教程之引入的核心概念 Playmaker Input引入的核心概念 Playmaker引入了4个核心概念:状态机.动作.变量和事件.了解它们是学习操作Playmaker ...

  8. Maven的几个核心概念

    POM (Project Object Model) 一个项目所有的配置都放置在 POM 文件中:定义项目的类型.名字,管理依赖关系,定制插件的行为等等.比如说,你可以配置 compiler 插件让它 ...

  9. 刀哥多线程GCD核心概念gcd

    GCD GCD 核心概念 将任务添加到队列,并且指定执行任务的函数 任务使用 block 封装 任务的 block 没有参数也没有返回值 执行任务的函数 异步 dispatch_async 不用等待当 ...

随机推荐

  1. module.exports输出的属性被ES6如何引用的

    阮一峰的ES6教程里有讲: import 命令加载 CommonJS 模块 Node 采用 CommonJS 模块格式,模块的输出都定义在module.exports这个属性上面.在 Node 环境中 ...

  2. 微信,支付宝,支付异步通知验签,notify_url

    在支付接口开发中 ,当用户支付完成之后,阿里或者微信会向我们服务器发送一个支付结果的通知,里边带有一系列参数:其中特殊的是签名类型,和签名(他们根据这些参数做出来的签名). 我们的得到这些参数之后要去 ...

  3. iOS的安全性和越狱

    提到越狱,很多人第一反应大概是免费的游戏和 app. 作为软件从业人员,深知中国的大环境的特殊性.内有用户想吃免费午餐的不良付费习惯,外有行业内大头诸如某讯对创新的绞杀.大家对越狱是为了免费.盗版软件 ...

  4. Windows远程连接Ubuntu (远程桌面和XDMCP)

    从RHEL/CentOS转过来,几乎所有的编码都在windows下,不习惯原生linux开发.总结了远程连接的两种方式,一种用Windows自带的rdp协议,另外一种用xdmcp协议 XRDP 就是用 ...

  5. 经典书单、站点 —— 大数据/数据分析/R语言

    1. 科普.入门 <大数据智能>,刘知远.崔安顺等著: 特色:系统,宏观和全面: 2. R 语言站点 http://langdawei.com/:R 语言数据采集与可视化:

  6. VC6下深入理解new[]和delete[](在多线程下new和delete的时候,必须选择上多线程库,不然可能造成进程崩溃)

    多少年了,一直处于C与C++混用的状态,申请空间一直用malloc,释放空间一直用free,为什么?因为他们好理解易操作,就如同输出一直用printf而不用<<,输入一直用scanf而不用 ...

  7. urllib2使用总结

    keywords: urllib2,BeautifulSoup,cookielib 题外话: 小弟是编程爱好者,各位看官轻拍. 最近在使用urllib2抓取网页内容,在学习的过程中也查阅了不少资料,并 ...

  8. B&#233;zier curve

    Applications in computer graphics and computer-aided design (CAD) require the rapid generation of sm ...

  9. 几种常见RuntimeException

    一般面试java Exception(runtimeException )是个问题必须要问 常见的异常上市45种,它的基本要求.许多其他....需要注意的积累   常见的几种例如以下:   NullP ...

  10. Font Awesome Text 使用方法

    <!-- basic text--> <com.beardedhen.androidbootstrap.FontAwesomeText android:layout_width=&q ...