Tarjeta de contactoContact card

La tarjeta de contacto muestra información de contacto, como el nombre, el número de teléfono y la dirección, de un Contacto (el mecanismo que usa Windows para representar personas y empresas).The contact card displays contact information, such as the name, phone number, and address, for a Contact (the mechanism Windows uses to represent people and businesses). La tarjeta de contacto también permite al usuario editar información de contacto.The contact card also lets the user edit contact info. Puedes elegir entre mostrar una tarjeta de contacto compacta o una tarjeta de contacto completa que contenga información adicional.You can choose to display a compact contact card, or a full contact card that contains additional information.

API importantes: método ShowContactCard, método ShowFullContactCard, método IsShowContactCardSupported, clase ContactImportant APIs: ShowContactCard method, ShowFullContactCard method, IsShowContactCardSupported method, Contact class

Hay dos formas de mostrar la tarjeta de contacto:There are two ways to display the contact card:

  • Como una tarjeta de contacto estándar que aparece en un control flotante con cierre del elemento por cambio de foco: la tarjeta de contacto desaparece cuando el usuario hace clic fuera de ella.As a standard contact card that appears in a flyout that is light-dismissable--the contact card dissapears when the user clicks outside of it.
  • Como una tarjeta de contacto completa que ocupa más espacio y no tiene cierre del elemento por cambio de foco: el usuario debe hacer clic en cerrar para cerrarla.As a full contact card that takes up more space and is not light-dismissable--the user must click close to close it.
Screenshot showing a standard contact card.
La tarjeta de contacto estándarThe standard contact card
Screenshot showing a full contact card.
La tarjeta de contacto completaThe full contact card

¿Es este el control adecuado?Is this the right control?

Usa la tarjeta de contacto cuando quieras mostrar la información de contacto de un contacto.Use the contact card when you want to display contact info for a contact. Si solo quieres mostrar el nombre del contacto y la imagen, usa el control de imagen de la persona.If you only want to display the contact's name and picture, use the person picture control.

Muestra de una tarjeta de contacto estándarShow a standard contact card

  1. Por lo general, se muestra una tarjeta de contacto porque el usuario ha hecho clic en algo: un botón o quizás el control de imagen de la persona.Typically, you show a contact card because the user clicked something: a button or perhaps the person picture control. No queremos ocultar el elemento.We don't want to hide the element. Para evitar ocultarla, necesitamos crear un elemento Rect que describa la ubicación y el tamaño del elemento.To avoid hiding it, we need to create a Rect that describes the location and size of the element.

    Vamos a crear una función de utilidad que lo haga por nosotros: la usaremos más adelante.Let's create a utility function that does that for us--we'll use it later.

    // Gets the rectangle of the element 
    public static Rect GetElementRectHelper(FrameworkElement element) 
    { 
        // Passing "null" means set to root element. 
        GeneralTransform elementTransform = element.TransformToVisual(null); 
        Rect rect = elementTransform.TransformBounds(new Rect(0, 0, element.ActualWidth, element.ActualHeight)); 
        return rect; 
    } 
    
    
  2. Determina si puedes mostrar la tarjeta de contacto mediante una llamada al método ContactManager.IsShowContactCardSupported.Determine whether you can display the contact card by calling the ContactManager.IsShowContactCardSupported method. Si no es compatible, muestra un mensaje de error.If it's not supported, display an error message. (En este ejemplo se supone que se va a mostrar la tarjeta de contacto en respuesta a un evento de clic).(This example assumes that you'll be showing the contact card in response to a click event .)

    // Contact and Contact Managers are existing classes 
    private void OnUserClickShowContactCard(object sender, RoutedEventArgs e) 
    { 
        if (ContactManager.IsShowContactCardSupported()) 
        { 
    
    
  3. Usa la función de utilidad que has creado en el paso 1 para obtener los límites del control que ha provocado el evento (para no taparlo con la tarjeta de contacto).Use the utility function you created in step 1 to get the bounds of the control that fired the event (so we don't cover it up with the contact card).

            Rect selectionRect = GetElementRect((FrameworkElement)sender); 
    
  4. Obtén el objeto Contact que quieres mostrar.Get the Contact object you want to display. Este ejemplo solo crea un contacto sencillo, pero el código debe recuperar un contacto real.This example just creates a simple contact, but your code should retrieve an actual contact.

                // Retrieve the contact to display
                var contact = new Contact(); 
                var email = new ContactEmail(); 
                email.Address = "jsmith@contoso.com"; 
                contact.Emails.Add(email); 
    
  5. Muestra la tarjeta de contacto mediante una llamada al método ShowContactCard.Show the contact card by calling the ShowContactCard method.

            ContactManager.ShowFullContactCard(
                contact, selectionRect, Placement.Default); 
        } 
    } 
    

Este es el ejemplo de código completo:Here's the complete code example:

// Gets the rectangle of the element 
public static Rect GetElementRect(FrameworkElement element) 
{ 
    // Passing "null" means set to root element. 
    GeneralTransform elementTransform = element.TransformToVisual(null); 
    Rect rect = elementTransform.TransformBounds(new Rect(0, 0, element.ActualWidth, element.ActualHeight)); 
    return rect; 
} 
 
// Display a contact in response to an event
private void OnUserClickShowContactCard(object sender, RoutedEventArgs e) 
{ 
    if (ContactManager.IsShowContactCardSupported()) 
    { 
        Rect selectionRect = GetElementRect((FrameworkElement)sender);

        // Retrieve the contact to display
        var contact = new Contact(); 
        var email = new ContactEmail(); 
        email.Address = "jsmith@contoso.com"; 
        contact.Emails.Add(email); 
    
        ContactManager.ShowContactCard(
            contact, selectionRect, Placement.Default); 
    } 
} 

Muestra de una tarjeta de contacto completaShow a full contact card

Para mostrar la tarjeta de contacto completa, llama al método ShowFullContactCard en lugar de ShowContactCard.To show the full contact card, call the ShowFullContactCard method instead of ShowContactCard.

private void onUserClickShowContactCard() 
{ 
   
    Contact contact = new Contact(); 
    ContactEmail email = new ContactEmail(); 
    email.Address = "jsmith@hotmail.com"; 
    contact.Emails.Add(email); 
 
 
    // Setting up contact options.     
    FullContactCardOptions fullContactCardOptions = new FullContactCardOptions(); 
 
    // Display full contact card on mouse click.   
    // Launch the People’s App with full contact card  
    fullContactCardOptions.DesiredRemainingView = ViewSizePreference.UseLess; 
     
 
    // Shows the full contact card by launching the People App. 
    ContactManager.ShowFullContactCard(contact, fullContactCardOptions); 
} 

Recuperación de contactos "reales"Retrieving "real" contacts

En los ejemplos de este artículo se crea un contacto sencillo.The examples in this article create a simple contact. En una aplicación real, seguramente quieras recuperar un contacto existente.In a real app, you'd probably want to retrieve an existing contact. Para obtener instrucciones, consulta el Artículo sobre contactos y calendario.For instructions, see the Contacts and calendar article.