Xamarin.Forms Views介绍(四)

2024-04-24 09:08
文章标签 介绍 xamarin views forms

本文主要是介绍Xamarin.Forms Views介绍(四),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

以下主要内容转自:http://www.jianshu.com/p/26be7c735fc4

 

Image使用

显示一个图片资源。支持“JPEG, PNG, GIF, and BMP”所有图片类型。

Image属性

Aspect :Aspect枚举类型,设置Image的缩放模式。

         

Fill - 拉伸图片填充整个显示区域,可能会导致图像失真.

AspectFill -剪切图片填充整个区域,不会使图像失真.

AspectFit - 不对图像进行拉伸和剪切处理,根据图像的大小上下或左右留白显示,默认值.

不同平台缩放效果可能会有所不同

IsLoading :bool类型,表示图片的加载状态。

IsOpaque :bool类型,设置Image是否透明。

Source :ImageSource类型,设置显示的图片资源。

 

ImageSource介绍

ImageSource提供了四个静态方法来创建对象。

FromUri :根据网络图片资源创建对象。

FromResource :根据嵌入到PCL的图片资源创建对象。

FromFile :根据各个平台提供的图片资源创建对象。

FromStream :根据.NET Stream创建对象。

Xamarin.Forms 提供了三个ImageSource的子类。

UriImageSource :表示网络图片资源,对应FromUri。

FileImageSource :表示平台相关图片资源,对应FromFile。

StreamImageSource :表示流图片资源,对应FromStream。

在XAML中定义ImageSource使用提供的ImageSource子类更方便,在代码中定义使用提供的静态方法更方便,静态方法内部实现就是返回系统提供的子类。

    

 

访问网络图片资源

FromUri代码示范:

            Content = new Image(){Source = ImageSource.FromUri(new Uri("http://cdn-qn0.jianshu.io/assets/apple-touch-icons/72-feca4b183b9d29fd188665785dc7a7f1.png"))};

注:原文中代替"Content"的是"Image  image",模拟运行时不能显示图片部分,后参考"CreatingMobileAppswithXamarinForms"文档修改为"Content"后正常。

也可以直接设置Image的Source为string或Uri类型地址,会隐式转换为ImageSource。

     Source = "http://cdn-qn0.jianshu.io/assets/apple-touch-icons/72-feca4b183b9d29fd188665785dc7a7f1.png"

对应XAML为:

<Image Source="http://cdn-qn0.jianshu.io/assets/apple-touch-icons/72-feca4b183b9d29fd188665785dc7a7f1.png"/>

以下为以上三种方式运行效果(Android端需要开启网络权限 ) :

 

XAML定义UriImageSource示范:

  <Image HorizontalOptions="Center" VerticalOptions="Center" WidthRequest="200" HeightRequest="200" Aspect="Fill"><Image.Source><UriImageSource Uri="http://cdn-qn0.jianshu.io/assets/apple-touch-icons/72-feca4b183b9d29fd188665785dc7a7f1.png"/></Image.Source></Image>

UriImageSource定义了CachingEnabled和CachingValidity连个属性。CachingEnabled表示是否启用缓存,bool类型默认为true。CachingValidity表示缓存的有效时间,TimeSpan类型,默认为1天。

做上述修改后运行效果如下:

 

 

访问嵌入到PCL图片资源

图片资源添加到PCL项目中,设置图片的Build Action为EmbeddedResource,我的vs中选择如下:

资源嵌入到项目中会有一个对应的资源ID,对应的资源ID为程序集名.文件夹(若果有).图片全名(包含扩展名),如果不能确定资源ID可以调用Assembly 对象的GetManifestResourceNames方法,返回一个string类型数组,表示项目中所有资源的ID。更简单的方法就是图片资源右键属性查看资源ID。实测我的项目并没有"资源ID "项,直接在代码中使用"TestToolbar.Images.image.png" 作为资源ID。

 

这里省略了新建Page的过程和相关代码。

XAML文件中添加如下代码:

  <Image x:Name="image"HorizontalOptions="Center" VerticalOptions="Center" WidthRequest="200" HeightRequest="200" Aspect="Fill"/>

调用FromResource创建图片资源,InitializeComponent方法下添加如下代码:

            var imageResID = "TestToolbar.Images.image.png";image.Source = ImageSource.FromResource(imageResID);

运行效果:

XAML中如何调用嵌入资源?如果你熟悉x:FactoryMethod使用,可能会想通过x:FactoryMethod调用ImageSource.FromResource方法,但是ImageSource.FromResource方法要求图片资源与调用方法在同一个程序集内,通过x:FactoryMethod调用ImageSource.FromResource方法时调用代码是在Xamarin.Forms.Xaml程序集内的。

《Creating Mobile App with Xamarin.Forms》中介绍了解决方法,原文链接也提供了示例,现在先不研究以后再进行学习。

访问单独平台图片资源

由于每个平台对一些图片有特别的分辨率要求,所以有时候会为每个平台准备不同大小图片,ImageSource.FromFile静态方法和相应的FileImageSource类能方便访问存储在平台项目中的图片资源。

各平台存储图片路径:

iOS - 图片存储在Resources 目录中并设置Build Action为BundleResource (提供@2x命名文件,相关分辨率知识不做介绍).

Android - 图片存储在Resources/drawable 目录中并设置Build Action:为AndroidResource. (不同分辨路图片放在Resources下drawable-ldpi 或drawable-hdpi 等子目录中 ).

Windows Phone - 图片存储在Assets目录或其子目录下并设置Build Action为Content .

先只摘录这些,以后有相关要求时再来进一步学习。

 

通过Stream访问图片资源

通过Stream可以访问网络图片和嵌入项目中的图片资源。ImageSource.FromStream或者StreamImageSource可以帮助我们轻松的访问Stream对应的图片资源。

FromStream方法的参数并不是Stream类型而是Func<Stream>类型(一个无参数,返回值为Stream的方法)。

示例1——访问本地嵌入图片资源

            var imageResID = "TestToolbar.Images.image.png";image.Source = ImageSource.FromStream(() =>{Assembly assembly = GetType().GetTypeInfo().Assembly;return assembly.GetManifestResourceStream(imageResID);});

示例2——访问网络图片资源

子线程中不允许更新UI,在子线程中更新UI借助Device.BeginInvokeOnMainThread方法完成。

不同平台图片显示效果不同。

Toolbar使用

Toolbar表示应用程序的工具栏,iOS和AndroidToolbar显示在屏幕顶部,Windows Phone显示在屏幕底部。

Forms并没有提供Toolbar类,为Page类的ToolbarItems集合赋值即可实现Toolbar效果。Windows Phone平台ContentPage添加ToolbarItem正常显示,Android和iOS平台必须使用NavigationPage。

ToolbarItem并不View实现而是继承MenuItem类,ToolbarItem定义了三个属性。

Text - ToolbarItem显示的文本。

Order - ToolbarItemOrder枚举类型,决定ToolbarItem显示图标(Primary)还是显示文字(Secondary)。

Icon - FileImageSource类型,ToolbarItem显示的图标。FileImageSource类型说明图标文件是单独存储在平台项目中。

XAML示例代码(此段代码未测试,待以后学习NavigationPage时再来测试):

  <ContentPage.ToolbarItems><ToolbarItem Text="Item 1" Order="Primary" Clicked="响应点击事件"><ToolbarItem.Icon><OnPlatform x:TypeArguments="FileImageSource"Android="tc.png"/></ToolbarItem.Icon></ToolbarItem><ToolbarItem Text="Item 2" Order="Primary" ><ToolbarItem.Icon><OnPlatform x:TypeArguments="FileImageSource"Android="tf.png"/></ToolbarItem.Icon></ToolbarItem><ToolbarItem Text="Item 3" Order="Primary" ><ToolbarItem.Icon><OnPlatform x:TypeArguments="FileImageSource"Android="tg.png"/></ToolbarItem.Icon></ToolbarItem><ToolbarItem Text="Item 4" Order="Secondary" ><ToolbarItem.Icon><OnPlatform x:TypeArguments="FileImageSource"iOS="tf.png"Android="tf.png"/></ToolbarItem.Icon></ToolbarItem><ToolbarItem Text="Item 5" Order="Secondary" ><ToolbarItem.Icon><OnPlatform x:TypeArguments="FileImageSource"iOS="tg.png"Android="tg.png"/></ToolbarItem.Icon></ToolbarItem></ContentPage.ToolbarItems>

一定要修改App.xaml.cs文件中构造函数MainPage赋值的代码为MainPage = new NavigationPage(new 自己的page类());

各平台图标像素要求

Android ToolbarItem图标像素:

• drawable-mdpi (medium DPI) — 32 pixels square

• drawable-hdpi (high DPI) — 48 pixels square

• drawable-xhdpi (extra high DPI) — 64 pixels square

• drawable-xxhdpi (extra extra high DPI) — 96 pixels square

IOS ToolbarItem图标像素:

默认为20像素正方形,应提供@2x(40-pixel-square )和@3x(60-pixel-square )版本使iPhone5 和iPhone6有更好的显示效果。

Windows Phone ToolbarItem图标像素要求:

大小为76像素的正方形图标。

这篇关于Xamarin.Forms Views介绍(四)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/931325

相关文章

性能测试介绍

性能测试是一种测试方法,旨在评估系统、应用程序或组件在现实场景中的性能表现和可靠性。它通常用于衡量系统在不同负载条件下的响应时间、吞吐量、资源利用率、稳定性和可扩展性等关键指标。 为什么要进行性能测试 通过性能测试,可以确定系统是否能够满足预期的性能要求,找出性能瓶颈和潜在的问题,并进行优化和调整。 发现性能瓶颈:性能测试可以帮助发现系统的性能瓶颈,即系统在高负载或高并发情况下可能出现的问题

水位雨量在线监测系统概述及应用介绍

在当今社会,随着科技的飞速发展,各种智能监测系统已成为保障公共安全、促进资源管理和环境保护的重要工具。其中,水位雨量在线监测系统作为自然灾害预警、水资源管理及水利工程运行的关键技术,其重要性不言而喻。 一、水位雨量在线监测系统的基本原理 水位雨量在线监测系统主要由数据采集单元、数据传输网络、数据处理中心及用户终端四大部分构成,形成了一个完整的闭环系统。 数据采集单元:这是系统的“眼睛”,

Hadoop数据压缩使用介绍

一、压缩原则 (1)运算密集型的Job,少用压缩 (2)IO密集型的Job,多用压缩 二、压缩算法比较 三、压缩位置选择 四、压缩参数配置 1)为了支持多种压缩/解压缩算法,Hadoop引入了编码/解码器 2)要在Hadoop中启用压缩,可以配置如下参数

图神经网络模型介绍(1)

我们将图神经网络分为基于谱域的模型和基于空域的模型,并按照发展顺序详解每个类别中的重要模型。 1.1基于谱域的图神经网络         谱域上的图卷积在图学习迈向深度学习的发展历程中起到了关键的作用。本节主要介绍三个具有代表性的谱域图神经网络:谱图卷积网络、切比雪夫网络和图卷积网络。 (1)谱图卷积网络 卷积定理:函数卷积的傅里叶变换是函数傅里叶变换的乘积,即F{f*g}

C++——stack、queue的实现及deque的介绍

目录 1.stack与queue的实现 1.1stack的实现  1.2 queue的实现 2.重温vector、list、stack、queue的介绍 2.1 STL标准库中stack和queue的底层结构  3.deque的简单介绍 3.1为什么选择deque作为stack和queue的底层默认容器  3.2 STL中对stack与queue的模拟实现 ①stack模拟实现

Mysql BLOB类型介绍

BLOB类型的字段用于存储二进制数据 在MySQL中,BLOB类型,包括:TinyBlob、Blob、MediumBlob、LongBlob,这几个类型之间的唯一区别是在存储的大小不同。 TinyBlob 最大 255 Blob 最大 65K MediumBlob 最大 16M LongBlob 最大 4G

FreeRTOS-基本介绍和移植STM32

FreeRTOS-基本介绍和STM32移植 一、裸机开发和操作系统开发介绍二、任务调度和任务状态介绍2.1 任务调度2.1.1 抢占式调度2.1.2 时间片调度 2.2 任务状态 三、FreeRTOS源码和移植STM323.1 FreeRTOS源码3.2 FreeRTOS移植STM323.2.1 代码移植3.2.2 时钟中断配置 一、裸机开发和操作系统开发介绍 裸机:前后台系

nginx介绍及常用功能

什么是nginx nginx跟Apache一样,是一个web服务器(网站服务器),通过HTTP协议提供各种网络服务。 Apache:重量级的,不支持高并发的服务器。在Apache上运行数以万计的并发访问,会导致服务器消耗大量内存。操作系统对其进行进程或线程间的切换也消耗了大量的CPU资源,导致HTTP请求的平均响应速度降低。这些都决定了Apache不可能成为高性能WEB服务器  nginx:

多路转接之select(fd_set介绍,参数详细介绍),实现非阻塞式网络通信

目录 多路转接之select 引入 介绍 fd_set 函数原型 nfds readfds / writefds / exceptfds readfds  总结  fd_set操作接口  timeout timevalue 结构体 传入值 返回值 代码 注意点 -- 调用函数 select的参数填充  获取新连接 注意点 -- 通信时的调用函数 添加新fd到

火语言RPA流程组件介绍--浏览网页

🚩【组件功能】:浏览器打开指定网址或本地html文件 配置预览 配置说明 网址URL 支持T或# 默认FLOW输入项 输入需要打开的网址URL 超时时间 支持T或# 打开网页超时时间 执行后后等待时间(ms) 支持T或# 当前组件执行完成后继续等待的时间 UserAgent 支持T或# User Agent中文名为用户代理,简称 UA,它是一个特殊字符串头,使得服务器