Compartir a través de


GravatarImageSource

Un Gravatar (un "avatar reconocido globalmente") es una imagen que se puede usar en varios sitios web como avatar, es decir, una imagen que representa a usted. Por ejemplo, un Gravatar puede identificar a una persona en una entrada de foro, en un comentario de blog, etc. (Puede registrar su propio Gravatar en el sitio web de Gravatar en http://www.gravatar.com/.) Si desea mostrar imágenes junto a nombres de personas o direcciones de correo electrónico, puede usar GravatarImageSource.

Sintaxis

Incluir el espacio de nombres XAML

Para usar el kit de herramientas en XAML, es necesario agregar el siguiente xmlns a la página o vista:

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"

Por lo tanto, el siguiente:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">

</ContentPage>

Se modificaría para incluir el xmlns de la siguiente manera:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

</ContentPage>

Uso de GravatarImageSource

En el siguiente ejemplo se muestra cómo usar GravatarImageSource:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    <VerticalStackLayout>
        <Image>
            <Image.Source>
                <toolkit:GravatarImageSource
                    CacheValidity="1"
                    CachingEnabled="True"
                    Email="youremail@here.com"
                    Image="MysteryPerson" />
            </Image.Source>
        </Image>
    </VerticalStackLayout>
</ContentPage>

El código de C# equivalente es el siguiente:

using CommunityToolkit.Maui.ImageSources;

partial class MyPage : ContentPage
{
	public MyPage()
	{
        Image myImage = new()
        {
            Source = new GravatarImageSource()
            {
                CacheValidity = TimeSpan.FromDays(1),
                CachingEnabled = true,
                Email = "youremail@here.com",
                Image= DefaultImage.MysteryPerson
            },
        };
		Content = myImage;
	}
}

Propiedades

Propiedad Tipo Descripción
CacheValidity TimeSpan La propiedad CacheValidity, de tipo TimeSpan, especifica cuánto tiempo se almacenará la imagen localmente. El valor predeterminado de esta propiedad es 1 día.
CachingEnabled bool La propiedad CachingEnabled, de tipo bool, define si el almacenamiento en caché de imágenes está habilitado. El valor predeterminado de esta propiedad es true.
Email string? La propiedad Email, de tipo string?, especifica la dirección de correo electrónico de la cuenta Gravatar. Si no se establece, se representa la imagen Gravatar. Si se establece y no se encuentra en Gravatar, se representará la Image imagen de propiedad.
Imagen DefaultImage La propiedad Image, de tipo DefaultImage es una enumeración que se usa para especificar la imagen predeterminada si email no se encuentra en Gravatar.

Estas propiedades están respaldadas por objetos BindableProperty, lo que significa que pueden ser destinos de los enlaces de datos, y con estilo.

Establecimiento de la validez de la caché

La CacheValidity propiedad es un TimeSpan objeto que especifica cuánto tiempo se almacenará la imagen localmente.

En el ejemplo siguiente se establece la validez de la memoria caché de : GravatarImageSource

<Image>
    <Image.Source>
        <toolkit:GravatarImageSource CacheValidity="1" />
    </Image.Source>
</Image>

El código de C# equivalente es el siguiente:

Image myImage = new()
{
    Source = new GravatarImageSource()
    {
        CacheValidity = TimeSpan.FromDays(1),
    },
};

Establecimiento del almacenamiento en caché habilitado

La CachingEnabled propiedad es un bool que define si el almacenamiento en caché de imágenes está habilitado.

En el ejemplo siguiente se establece el almacenamiento en caché en habilitado para : GravatarImageSource

<Image>
    <Image.Source>
        <toolkit:GravatarImageSource CachingEnabled="True" />
    </Image.Source>
</Image>

El código de C# equivalente es el siguiente:

Image myImage = new()
{
    Source = new GravatarImageSource()
    {
        CachingEnabled = true,
    },
};

Definición de correo electrónico

La Email propiedad es un valor que acepta stringvalores NULL. Si la propiedad es nula o está vacía, se representa la imagen de Gravatar predeterminada. Si la dirección de correo electrónico no tiene ninguna imagen gravatar coincidente, se representa la Image imagen de propiedad.

En el ejemplo siguiente se establece una dirección de correo electrónico que tiene una imagen de Gravatar coincidente:

<Image>
    <Image.Source>
        <toolkit:GravatarImageSource Email="dsiegel@avantipoint.com" />
    </Image.Source>
</Image>

El código de C# equivalente es el siguiente:

Image myImage = new()
{
    Source = new GravatarImageSource()
    {
        Email = "dsiegel@avantipoint.com",
    },
};

En el ejemplo siguiente no se establece una dirección de correo electrónico y, por tanto, se mostrará la imagen de Gravatar predeterminada.

<Image>
    <Image.Source>
        <toolkit:GravatarImageSource />
    </Image.Source>
</Image>

El código de C# equivalente es el siguiente:

Image myImage = new()
{
    Source = new GravatarImageSource(),
};

En el ejemplo siguiente se establece una dirección de correo electrónico que no tiene ninguna imagen Gravatar coincidente y, por tanto, se mostrará la imagen predeterminada Image.

<Image>
    <Image.Source>
        <toolkit:GravatarImageSource Email="notregistered@emailongravitar.com" />
    </Image.Source>
</Image>

El código de C# equivalente es el siguiente:

Image myImage = new()
{
    Source = new GravatarImageSource()
    {
        Email = "notregistered@emailongravitar.com",
    },
};

Usar imagen predeterminada

La Image propiedad es una enumeración que se usa para especificar la imagen predeterminada si la email dirección no tiene ninguna imagen gravatar coincidente. Las opciones disponibles son:

  • MysteryPerson (valor predeterminado) - Un contorno simple y de estilo de dibujos animados de una persona (no varía según el hash de correo electrónico)
  • FileNotFound - No cargue ninguna imagen si no está asociada con el hash de correo electrónico, en su lugar devuelve una respuesta HTTP 404 (archivo no encontrado).
  • Identicon - Un patrón geométrico basado en un hash de correo electrónico.
  • MonsterId - Un 'monstruo' generado con diferentes colores, caras, etc.
  • Wavatar - Caras generadas con características y fondos diferentes.
  • Retro - Impresionante generado, caras pixeladas de estilo arcade de 8 bits.
  • Robohash - Un robot generado con diferentes colores, caras, etc.
  • Blank - Una imagen PNG transparente.

En el ejemplo siguiente se establece la imagen predeterminada de : GravatarImageSource

<Image>
    <Image.Source>
        <toolkit:GravatarImageSource Email="notregistered@emailongravitar.com" Image="Retro" />
    </Image.Source>
</Image>

El código de C# equivalente es el siguiente:

Image myImage = new()
{
    Source = new GravatarImageSource()
    {
        Email = "notregistered@emailongravitar.com",
        Image = DefaultImage.Retro
    },
};

Establecer el tamaño de la imagen

De forma predeterminada, las imágenes GravatarImageSource se presentan en 80px por 80px. Los tamaños de imagen pueden estar entre 1px y 2048px y se toman de sus propiedades de tamaño de vista principal. Las imágenes Gravatar son cuadradas y se tomará la mayor parte de las propiedades de tamaño definidas.

En el ejemplo siguiente se establece el tamaño del control de imagen y, por tanto, el tamaño de la imagen Gravatar solicitada será de 73 píxeles.

<Image WidthRequest="72" HeightRequest="73">
    <Image.Source>
        <toolkit:GravatarImageSource Email="dsiegel@avantipoint.com" />
    </Image.Source>
</Image>

El código de C# equivalente es el siguiente:

Image myImage = new()
{
    Source = new GravatarImageSource()
    {
        Email = "dsiegel@avantipoint.com",
    },
    HeightRequest = 72,
    HeightRequest = 73,
};

Ejemplos

Puede encontrar un ejemplo de este comportamiento en acción en la Aplicación de muestra del kit de herramientas de la comunidad de .NET MAUI.

API

Puede encontrar el código fuente de GravatarImageSource en el repositorio de GitHub del Kit de herramientas de la comunidad de .NET MAUI.