`
lindexi-gd
  • 浏览: 139728 次
社区版块
存档分类
最新评论

UWP xaml 圆形头像

 
阅读更多

圆形头像

现在很多软件都喜欢使用圆形头像
win10 uwp使用圆形头像很简单

            <Ellipse Width="200" Height="200" Margin="10,10,10,10">
                <Ellipse.Fill>
                    <ImageBrush ImageSource="assets/1.jpg"/>
                </Ellipse.Fill>
            </Ellipse>

使用这样的圆形头像没有对原有图形的渲染大小进行变化,一个大的图形不会解码为刚好要的,我们进行一步修改

代码:

<Page
    x:Class="Roundhead.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Roundhead"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <StackPanel Orientation="Vertical">
            <Ellipse Width="200" Height="200" Margin="10,10,10,10">
                <Ellipse.Fill>
                    <ImageBrush ImageSource="assets\1.jpg"/>
                </Ellipse.Fill>
            </Ellipse>
            <TextBlock Text="我的头像是圆" HorizontalAlignment="Center" />
        </StackPanel>
    </Grid>
</Page>

圆形头像

去掉黑边

程序界面有一些
程序界面有一些
看起来不好
在app.xaml.cs找到this.DebugSettings.EnableFrameRateCounter = true;
写为false
this.DebugSettings.EnableFrameRateCounter = false;

拖动打开图形

<ImageBrush ImageSource="assets\1.jpg"/>添加x:Name="ximg"
在Grid增加AllowDrop="True" DragOver="Grid_DragOver" Drop="Grid_Drop"
Grid_Drop

        private async void Grid_Drop(object sender , DragEventArgs e)
        {
            var defer = e.GetDeferral();

            try
            {
                DataPackageView dataView = e.DataView;
                // 拖放类型为文件存储。
                if (dataView.Contains(StandardDataFormats.StorageItems))
                {
                    var files = await dataView.GetStorageItemsAsync();
                    StorageFile file = files.OfType<StorageFile>().First();
                    if (file.FileType == ".png" || file.FileType == ".jpg")
                    {
                        // 拖放的是图片文件。
                        BitmapImage bitmap = new BitmapImage();
                        await bitmap.SetSourceAsync(await file.OpenAsync(FileAccessMode.Read));
                        ximg.ImageSource = bitmap;
                    }                    
                }
            }
            finally
            {
                defer.Complete();
            }
        }

Grid_DragOver

        private void Grid_DragOver(object sender , DragEventArgs e)
        {
            //需要using Windows.ApplicationModel.DataTransfer;
            e.AcceptedOperation = DataPackageOperation.Copy;

            // 设置拖放时显示的文字。
            //e.DragUIOverride.Caption = "拖放打开";

            // 是否显示拖放时的文字。默认为 true。
            //e.DragUIOverride.IsCaptionVisible = false;

            // 是否显示文件预览内容,一般为文件图标。默认为 true。
            // e.DragUIOverride.IsContentVisible = false;

            // Caption 前面的图标是否显示。默认为 true。
            //e.DragUIOverride.IsGlyphVisible = false;

            //需要using Windows.UI.Xaml.Media.Imaging;
            //设置拖动图形,覆盖文件预览
            //e.DragUIOverride.SetContentFromBitmapImage(new BitmapImage(new Uri("ms-appx:///Assets/1.jpg")));

            e.Handled = true;
        }

这里写图片描述

e.AcceptedOperation = DataPackageOperation.Copy;设置拖动作为复制
需要using Windows.ApplicationModel.DataTransfer

拖放显示文字e.DragUIOverride.Caption = "拖放打开";
这里写图片描述

是否显示拖放时的文字。默认为 truee.DragUIOverride.IsCaptionVisible = false;
这里写图片描述

复制图标是否显示 e.DragUIOverride.IsGlyphVisible = false;
这里写图片描述

设置拖动图形,覆盖文件预览e.DragUIOverride.SetContentFromBitmapImage(new BitmapImage(new Uri(img)));
这里写图片描述

代码:https://code.csdn.net/lindexi_gd/lindexi_gd/tree/master/Roundhead

参考:http://timheuer.com/blog/archive/2015/05/06/making-circular-images-in-xaml-easily.aspx

<script type="text/javascript"> $(function () { $('pre.prettyprint code').each(function () { var lines = $(this).text().split('\n').length; var $numbering = $('<ul/>').addClass('pre-numbering').hide(); $(this).addClass('has-numbering').parent().append($numbering); for (i = 1; i <= lines; i++) { $numbering.append($('<li/>').text(i)); }; $numbering.fadeIn(1700); }); }); </script>
分享到:
评论

相关推荐

    IconCorruptionTest:WIP:尝试在UWP XAML中重现图像渲染错误

    【IconCorruptionTest:WIP:尝试在UWP XAML中重现图像渲染错误】 这个项目“IconCorruptionTest”是一个工作进行中(WIP)的实验,目标是研究和重现UWP(Universal Windows Platform)XAML应用中的图像渲染问题。...

    AvaloniaBehaviors:Avalonia Xaml 的 Windows UWP Xaml 行为端口

    Avalonia XAML 行为 AvaloniaBehaviors是 XAML 的 XAML 行为的版本的端口。 Avalonia XAML Behaviors 是一种易于使用的方法,可使用最少的代码为您的应用程序添加常见且可重用的交互性。 Avalonia 端口仅可用于托管...

    Xbox Game Bar 小部件 的示例代码_c#_代码_下载

    Xbox Game Bar 小部件是一个 Windows UWP XAML 应用程序,它具有呈现到 Xbox Game Bar 的 UI 中的 XAML 视图。 除了稍微不同的应用程序激活和应用程序激活时的一点“引导”之外,Xbox 游戏栏小部件与任何其他 UWP ...

    XamlBehaviors:这是GitHub上UWP XAML行为的官方主页

    XAML行为是一种易于使用的方法,可以用最少的代码向Windows UWP应用程序添加常见和可重用的交互性。 它适用于本机和托管应用程序。 XAML行为的使用受MIT许可证的约束 建置状态 平台 地位 管理 本国的 入门 从哪里...

    DirectX 12 .NET 游戏引擎.zip

    它支持 UWP,可以直接渲染到CoreWindow或嵌入到 XAML 中SwapChainPanel。它还支持 Win32 和 WinForms。一些突出的功能包括着色器生成器(可从 .NET 代码生成 HLSL 着色器)、HoloLens 和 Windows Mixed Reality 的...

    uwp开发-demoHelloworld源码

    在UWP开发中,开发者会使用C#或Visual Basic .NET作为主要编程语言,结合XAML(Extensible Application Markup Language)来定义用户界面。项目结构通常包含App.xaml及其代码-behind文件,用于设置应用生命周期事件...

    UWP程序开发200例

    《UWP程序开发200例》是针对Windows Universal Platform(UWP)应用程序开发的一份综合教程,旨在帮助开发者深入理解和实践XAML技术。UWP是微软推出的一种跨平台的应用程序开发框架,允许开发者创建能在Windows 10...

    SfMaps_GettingStarted_UWP:SfMaps_GettingStarted_UWP

    现在,将SyncfusionControls for UWP XAML参考添加到应用程序参考中,并在MainWindow.xaml中生成xmlns名称空间代码,如下所示。 &lt;Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    AI到XAML的导出插件

    标题中的“AI到XAML的导出插件”是指一个工具,它允许用户将Adobe Illustrator(AI)的设计图转换成Windows Presentation Foundation(WPF)或通用Windows平台(UWP)应用程序所使用的XAML(XAML是Extensible Application ...

    Windows-UWP官方案例源码

    XAML(Extensible Application Markup Language)是UWP应用的主要界面描述语言,它允许开发者通过XML语法定义用户界面布局和控件。XAML具有声明性,使得UI设计直观且易于维护。UWP提供了丰富的内置控件,如按钮、...

    XAML转HTML.zip

    XAML(eXtensible Application Markup Language)是微软开发的一种标记语言,主要用于描述WPF(Windows Presentation Foundation)、UWP(Universal Windows Platform)以及Silverlight等应用程序的用户界面。...

    XAML入门 word文档

    XAML(Extensible Application Markup Language)是一种用于描述用户界面(UI)的声明式标记语言,主要应用于.NET Framework,特别是Windows Presentation Foundation(WPF)和UWP(Universal Windows Platform)等...

    XAML入门精通资料

    XAML(eXtensible Application Markup Language)是一种声明式标记语言,主要用于构建Windows Presentation Foundation (WPF)、Windows Store apps、UWP(Universal Windows Platform)以及Silverlight等.NET ...

    HTML与XAML转换源码

    **XAML** 则是一种XML-based语言,由微软设计,主要用于描述WPF和UWP应用的用户界面。XAML提供了一种声明式的方式来定义UI元素,如按钮、文本框等,并可以轻松地绑定数据、实现动画效果以及自定义控件。XAML的优势...

    Xaml in a NetShell

    XAML(eXtensible Application Markup Language)是一种标记语言,主要用于构建WPF(Windows Presentation Foundation)、UWP(Universal Windows Platform)和Silverlight等Microsoft技术中的用户界面。XAML是一种...

    UWP编程宝典

    例如,“Define pagelayout with XAML”章节会指导开发者使用XAML标记语言来构建用户界面,这是所有UWP应用的核心技术之一。XAML提供了丰富的布局面板(如Grid和StackPanel),以及支持元素的对齐、边距和填充等高级...

    Uwp中的换肤

    2. **XAML动态换肤**:XAML是UWP界面设计的主要语言,我们可以通过动态修改XAML元素的Style或Template属性来实现换肤。例如,可以为按钮、文本框等控件预定义多种样式,并在运行时根据用户选择的主题进行切换。 3. ...

    用xamlreader读写XAML页面

    在.NET框架中,XAML(eXtensible Application Markup Language)是一种用于定义用户界面和对象图的标记语言,尤其在WPF(Windows Presentation Foundation)、Silverlight以及UWP(Universal Windows Platform)等...

    XAML-基础教程

    XAML被广泛应用于.NET Framework中的WPF(Windows Presentation Foundation)以及Silverlight、Windows Phone和UWP(通用Windows平台)应用开发中。 #### XAML基本概念与语法 **XAML** 是一种用于描述UI界面的标记...

    UWP自适应界面代码示例

    1. **XAML和UI元素**:XAML是UWP应用构建用户界面的主要语言,通过定义各种UI元素(如Grid、StackPanel、RelativePanel等)和它们的属性,可以创建丰富的交互界面。在`AdaptiveLayout`项目中,你可能看到了如何使用...

Global site tag (gtag.js) - Google Analytics