Observação
O acesso a essa página exige autorização. Você pode tentar entrar ou alterar diretórios.
O acesso a essa página exige autorização. Você pode tentar alterar os diretórios.
Observação
Este livro foi publicado na primavera de 2016 e não foi atualizado desde então. Há muito no livro que permanece valioso, mas parte do material está desatualizado e alguns tópicos não estão mais totalmente corretos ou completos.
Este capítulo explora oito View derivadas que permitem a interação com o usuário.
Exibir a visão geral
Xamarin.Formscontém 20 classes instanciáveis que derivam, mas não Layout.View Seis deles foram abordados em capítulos anteriores:
Label: Capítulo 2. Anatomia de um aplicativoBoxView: Capítulo 3. Rolando a pilhaButton: Capítulo 6. Cliques de botãoImage: Capítulo 13. BitmapsActivityIndicator: Capítulo 13. BitmapsProgressBar: Capítulo 14. Layout absoluto
As oito exibições neste capítulo permitem efetivamente que o usuário interaja com tipos de dados básicos do .NET:
| Tipo de dados | Exibições |
|---|---|
Double |
Slider, Stepper |
Boolean |
Switch |
String |
Entry, Editor, SearchBar |
DateTime |
DatePicker, TimePicker |
Você pode pensar nessas exibições como representações visuais interativas dos tipos de dados subjacentes. Este conceito é explorado mais no próximo capítulo, Capítulo 16. Associação de dados.
Os seis pontos de vista restantes são abordados nos seguintes capítulos:
WebView: Capítulo 16. Vinculação de dadosPicker: Capítulo 19. Modos de exibição da coleçãoListView: Capítulo 19. Modos de exibição da coleçãoTableView: Capítulo 19. Modos de exibição da coleçãoMap: Capítulo 28. Localização e mapasOpenGLView: Não abordado neste livro (e sem suporte para plataformas Windows)
Controle deslizante e stepper
Ambos Slider e Stepper permitem que o usuário escolha um valor numérico de um intervalo. O Slider é um intervalo contínuo, enquanto o Stepper envolve valores discretos.
Noções básicas do controle deslizante
O Slider é uma barra horizontal que representa um intervalo de valores de um mínimo à esquerda a um máximo à direita. Ele define três propriedades públicas:
Valuedo tipodouble, valor padrão de 0Minimumdo tipodouble, valor padrão de 0Maximumdo tipodouble, valor padrão de 1
As propriedades associáveis que dão suporte a essas propriedades garantem que elas sejam consistentes:
- Para todas as três propriedades, o
coerceValuemétodo especificado para a propriedade associável garante queValueesteja entreMinimumeMaximum. - O
validateValuemétodo onMinimumPropertyretornafalseifMinimumestá sendo definido como um valor maior ou igual aMaximum, e semelhante paraMaximumProperty. RetornarfalsedovalidateValuemétodo faz com que umArgumentExceptionseja levantado.
Slider aciona o ValueChanged evento com um ValueChangedEventArgs argumento quando a Value propriedade é alterada, programaticamente ou quando o usuário manipula o Slider.
O exemplo SliderDemo demonstra o uso simples do Slider.
Armadilhas comuns
Tanto no código quanto no XAML, as Minimum propriedades and Maximum são definidas na ordem especificada. Certifique-se de inicializar essas propriedades para que Maximum seja sempre maior que Minimum. Se não uma exceção será lançada.
A inicialização das Slider propriedades pode fazer com que a Value propriedade seja alterada e o ValueChanged evento seja acionado. Você deve garantir que o manipulador de eventos não acesse exibições que ainda não foram criadas durante a Slider inicialização da página.
O ValueChanged evento não é acionado durante Slider a inicialização, a menos que a Value propriedade seja alterada. Você pode chamar o ValueChanged manipulador diretamente do código.
Seleção de cores do controle deslizante
O programa RgbSliders contém três Slider elementos que permitem selecionar interativamente uma cor especificando seus valores RGB:
O exemplo TextFade usa dois Slider elementos para mover dois Label elementos através de um AbsoluteLayout e esmaecer um no outro.
A diferença do Stepper
O Stepper define as mesmas propriedades e eventos que Slider , mas a Maximum propriedade é inicializada como 100 e Stepper define uma quarta propriedade:
Incrementdo tipodouble, inicializado como 1
Visualmente, o Stepper consiste em dois botões rotulados – e +. Pressionar – diminui Value em Increment até um mínimo de Minimum. Pressionar + aumenta Value até Increment um máximo de Maximum.
Isso é demonstrado pelo exemplo StepperDemo.
Interruptor e caixa de seleção
O permite Switch que o usuário especifique um valor booleano.
Noções básicas do switch
Visualmente, consiste Switch em uma alternância que pode ser desativada e ativada. A classe define uma propriedade:
IsToggleddo tipobool
Switch define um evento:
Toggledacompanhado por umToggledEventArgsobjeto, disparado quando aIsToggledpropriedade muda.
O programa SwitchDemo demonstra o Switch.
Uma CheckBox tradicional
Alguns desenvolvedores podem preferir um formato mais tradicional CheckBox ao Switch. A Xamarin.Formsbiblioteca Book.Toolkit contém uma CheckBox classe que deriva de ContentView. CheckBox é implementado pelos arquivos CheckBox.xaml e CheckBox.xaml.cs . CheckBox Define três propriedades (Text, FontSizee IsChecked) e um CheckedChanged evento.
O exemplo CheckBoxDemo demonstra isso CheckBox.
Digitando texto
Xamarin.Forms Define três modos de exibição que permitem ao usuário inserir e editar texto:
Entrypara uma única linha de textoEditorpara várias linhas de textoSearchBarpara uma única linha de texto para fins de pesquisa.
Entry e Editor derivar de InputView, que deriva de View. SearchBar deriva diretamente de View.
Teclado e foco
Em telefones e tablets sem teclados físicos, os Entryelementos , Editore SearchBar fazem com que um teclado virtual apareça. A presença deste teclado na tela está relacionada ao foco de entrada. Uma exibição deve ter suas IsVisible propriedades e IsEnabled definidas como true para obter o foco de entrada.
Dois métodos, uma propriedade somente leitura e dois eventos estão envolvidos com o foco de entrada. Todos eles são definidos por VisualElement:
- O
Focusmétodo tenta definir o foco de entrada para um elemento e retornatruese for bem-sucedido - O
Unfocusmétodo remove o foco de entrada de um elemento - A
IsFocusedpropriedade somente leitura indica se o elemento tem foco de entrada - O
Focusedevento indica quando um elemento obtém o foco de entrada - O
Unfocusedevento indica quando um elemento perde o foco de entrada
Escolhendo o teclado
A InputView classe da qual Entry e Editor derivam define apenas uma propriedade:
Isso indica o tipo de teclado exibido. Alguns teclados são otimizados para URIs ou números.
A Keyboard classe permite definir um teclado com um método estático Keyboard.Create com um argumento do tipo KeyboardFlags, uma enumeração com os seguintes sinalizadores de bits:
Nonedefinido como 0CapitalizeSentencedefinido como 1Spellcheckdefinido como 2Suggestionsdefinido como 4Alldefinido como \xFFFFFFFF
Ao usar a multilinha Editor quando um parágrafo ou mais de texto é esperado, chamar Keyboard.Create é uma boa abordagem para selecionar um teclado. Para a linha Entryúnica, as seguintes propriedades estáticas somente leitura de Keyboard são úteis:
O KeyboardTypeConverter permite especificar essas propriedades em XAML, conforme demonstrado pelo programa EntryKeyboards .
Propriedades e eventos de entrada
A linha Entry única define as seguintes propriedades:
Textdo tipostring, o texto que aparece noEntryTextColordo tipoColorFontFamilydo tipostringFontSizedo tipodoubleFontAttributesdo tipoFontAttributesIsPassworddo tipobool, que faz com que os caracteres sejam mascaradosPlaceholderdo tipostring, para texto mal colorido que aparece no antes de qualquer coisa ser digitadaEntryPlaceholderColordo tipoColor
O Entry também define dois eventos:
TextChangedcom umTextChangedEventArgsobjeto, disparado sempre que aTextpropriedade é alteradaCompleted, disparado quando o usuário terminar e o teclado for descartado. O usuário indica a conclusão de maneira específica da plataforma
O exemplo QuadraticEquations demonstra esses dois eventos.
A diferença do Editor
A multilinha Editor define as mesmas Text propriedades e Font como Entry , mas não as outras propriedades. Editor também define as mesmas duas propriedades que Entry.
JustNotes é um programa de anotações de forma livre que salva e restaura o conteúdo do Editor.
A barra de pesquisa
O SearchBar não deriva de InputView, portanto, não tem uma Keyboard propriedade. Mas ele tem todas as Textpropriedades , Font, e Placeholder que Entry define. Além disso, SearchBar define três propriedades adicionais:
CancelButtonColordo tipoColorSearchCommanddo tipoICommandpara uso com associações de dados e MVVMSearchCommandParameterdo tipoObject, para uso comSearchCommand
O botão de cancelamento específico da plataforma apaga o texto. O SearchBar também possui um botão de pesquisa específico da plataforma. Pressionar qualquer um desses botões gera um dos dois eventos que SearchBar definem:
TextChangedacompanhado por umTextChangedEventArgsobjetoSearchButtonPressed
O exemplo SearchBarDemo demonstra o SearchBar.
Seleção de data e hora
As DatePicker exibições and TimePicker implementam controles específicos da plataforma que permitem que o usuário especifique uma data ou hora.
O DatePicker
DatePicker Define quatro propriedades:
MinimumDatedo tipoDateTime, inicializado em 1º de janeiro de 1900MaximumDatedo tipoDateTime, inicializado em 31 de dezembro de 2100Datedo tipoDateTime, inicializado paraDateTime.TodayFormatdo tipostring, a cadeia de caracteres de formatação do .NET inicializada como "d", o padrão de data abreviada, resultando em uma exibição de data como "20/07/1969" nos EUA.
Você pode definir as DateTime propriedades em XAML expressando-as como elementos de propriedade e usando o formato de data abreviada invariável de cultura ("20/07/1969").
O exemplo DaysBetweenDates calcula o número de dias entre duas datas selecionadas pelo usuário.
O TimePicker (ou é um TimeSpanPicker?)
TimePicker define duas propriedades e nenhum evento:
Timeé do tipoTimeSpanem vez deDateTime, indicando o tempo decorrido desde a meia-noiteFormatdo tipostring, a cadeia de caracteres de formatação do .NET inicializada como "t", o padrão de tempo curto, resultando em uma exibição de hora como "13h45" nos EUA.
O programa SetTimer demonstra como usar o TimePicker para especificar um tempo para um temporizador. O programa só funciona se você o mantiver em primeiro plano.
SetTimer também demonstra o DisplayAlert uso do método de para exibir uma caixa de Page alerta.
