文档章节

Xamarin XAML语言教程ContentView视图作为自定义视图的父类

大学霸
 大学霸
发布于 2017/07/11 10:08
字数 445
阅读 6
收藏 0

Xamarin XAML语言教程ContentView视图作为自定义视图的父类

自定义视图的父类:ContentView视图可以作为自定义视图的父类。

【示例14-2】以下将自定义一个颜色视图。具体的操作步骤如下:

(1)创建一个Forms Xaml View文件,命名为ColorView。

(2)打开ColorView.xaml文件,编写代码,构建自定义颜色视图。代码如下:

 

  • <?xml version="1.0" encoding="UTF-8"?>
  • <ContentView xmlns="http://xamarin.com/schemas/2014/forms"
  •              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
  •              x:Class="ContentViewCustomControls.ColorView">
  •   <Frame OutlineColor="Accent">
  •     <StackLayout Orientation="Horizontal">
  •       <BoxView x:Name="boxView"
  •                WidthRequest="70"
  •       HeightRequest="70" />
  •       <StackLayout>
  •         <Label x:Name="colorNameLabel"
  •                FontSize="Large"
  •                VerticalOptions="CenterAndExpand" />
  •         <Label x:Name="colorValueLabel"
  •                VerticalOptions="CenterAndExpand" />
  •       </StackLayout>
  •     </StackLayout>
  •   </Frame>
  • </ContentView>

(3)打开ColorView.xaml.cs文件,编写代码,实现一些与颜色视图相关的属性。代码如下:

 

  • using System;
  • using System.Collections.Generic;
  • using System.Linq;
  • using System.Text;
  • using System.Threading.Tasks;
  • using Xamarin.Forms;
  • namespace ContentViewCustomControls
  • {
  •     public partial class ColorView : ContentView
  •     {
  •         string colorName;
  •         ColorTypeConverter colorTypeConv = new ColorTypeConverter();
  •         public ColorView()
  •         {
  •             InitializeComponent();
  •         }
  •         //颜色名称
  •         public string ColorName
  •         {
  •             set
  •             {
  •                 colorName = value;
  •                 colorNameLabel.Text = value;
  •                 Color color = (Color)colorTypeConv.ConvertFromInvariantString(colorName);
  •                 boxView.Color = color;
  •                 colorValueLabel.Text = String.Format("{0:X2}-{1:X2}-{2:X2}",
  •                 (int)(255 * color.R),
  •                 (int)(255 * color.G),
  •                 (int)(255 * color.B));
  •             }
  •             get
  •             {
  •                 return colorName;
  •             }
  •         }
  •     }
  • }

(4)打开MainPage.xaml文件,编写代码,通过颜色视图实现对内容页面的布局。代码如下:

 

  • <?xml version="1.0" encoding="utf-8" ?>
  • <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
  •              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
  •              xmlns:local="clr-namespace:ContentViewCustomControls"
  •              x:Class="ContentViewCustomControls.MainPage">
  •   <ContentPage.Padding>
  •     <OnPlatform x:TypeArguments="Thickness"
  •                 iOS="0, 20, 0, 0" />
  •   </ContentPage.Padding>
  •   <StackLayout Padding="6, 0">
  •     <local:ColorView ColorName="Aqua" />
  •     <local:ColorView ColorName="Black" />
  •     <local:ColorView ColorName="Blue" />
  •     <local:ColorView ColorName="Fuchsia" />
  •     <local:ColorView ColorName="Gray" />
  •   </StackLayout>
  • </ContentPage>

此时运行程序,会看到如图14.10~14.11所示的效果。

(5)构建更复杂的布局模式:在ContentView中可以包含视图,还可以包括布局,从而构建更为复杂的布局模式。

© 著作权归作者所有

共有 人打赏支持
大学霸
粉丝 255
博文 867
码字总数 542196
作品 0
东城
程序员
XamarinForms教程构建XamarinForms开发环境

构建XamarinForms开发环境 所谓Xamarin.Forms的开发环境,就是指在基本硬件和数字软件的基础上,为支持系统软件和应用软件的工程化开发和维护而使用的一组软件,简称SDE。对于任何的程序来说...

大学霸
2016/01/21
41
0
Xamarin.Forms探索--使用 Xamarin.Forms 来创建跨平台的用户界面

Xamarin.Forms 是一个跨平台的、基于原生控件的UI工具包,开发人员可以轻松的创建适用于 Android,iOS 以及 Windows Phone的用户界面。与HTML 5 不同的时,Xamarin.Forms 通过使用平台的原生...

葡萄城控件技术团队
2015/03/05
0
0
Xamarin 学习笔记 - Page(页面)

本文翻译自CodeProject文章:https://www.codeproject.com/Articles/1226447/Xamarin-Notes-Xamarin-Forms-Pages 转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和...

葡萄城技术团队
08/02
0
0
​Xamarin iOS教程之自定义视图

Xamarin iOS教程之自定义视图 Xamarin iOS自定义视图 工具栏中的视图在实际应用开发中用的很多,但是为了吸引用户的眼球,开发者可以做出一些自定义的视图。 【示例2-33】以下将实现一个自定...

大学霸
2015/06/24
0
0
iOS实例——滑动列表展现/隐藏顶部视图

引 项目中需要一个效果:下滚列表时顶部的自定义视图不移动,上移时隐藏顶部视图,提高列表的展现范围。在此基础上海加了一个隐藏列表时的动态渐入渐出效果,如下: 实现 实现的要点是,顶部...

cloudox_
2017/04/20
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Ubuntu18.04下载安装Google图解法

首先Ctrl + Alt + T打开终端,或者可以在在搜索框搜索终端。 (1)sudo wget http://www.linuxidc.com/files/repo/google-chrome.list -P /etc/apt/sources.list.d/ ,(将下载源加入到系统的...

AI_SKI
10分钟前
0
0
spring could采坑 eureka开启验证后无法连接注册中心

com.netflix.discovery.shared.transport.TransportException: Cannot execute request on any known server at com.netflix.discovery.shared.transport.decorator.RetryableEurekaHttpClie......

君千殇520
10分钟前
0
0
支付宝小程序下单支付接口:40004 ACQ.INVALID_PARAMETER

下面是支付宝下单接口 https://docs.open.alipay.com/api_1/alipay.trade.create/ 如果按官方文档的说明,并没有解释清楚buyer_id什么时候要传,只是说:特殊可选,啥叫特殊可选?!在调小程...

swingcoder
19分钟前
0
0
【Java】广州三本秋招经历

前言 只有光头才能变强 离上次发文章已经快两个月时间了,最近一直忙着秋招的事。今天是2018年10月22日,对于互联网行业来说,秋招就基本结束了。我这边的流程也走完了(不再笔试/面试了),所...

Java3y
21分钟前
1
0
在idea中启动多个SpringBoot项目

https://blog.csdn.net/forezp/article/details/76408139

灯下草虫鸣_
23分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部