Transcrições
1. Visão geral do curso: Olá, Meu nome é Jeff, e bem-vindo ao IOS Fundamentals Course, onde vamos construir nossa primeira aplicação que se parece com isso. Este curso pressupõe que você tenha experiência básica de programação e queira saber mais sobre o desenvolvimento de aplicativos IOS. Este curso é composto por 20 tutoriais em vídeo para cada vídeo, aborda um tópico específico do IOS e, em seguida, aplica esse tópico para criar nossa aplicação. Cada vídeo da Siri baseia-se nos vídeos que vieram antes dele para que você possa
programar em seu próprio projeto para cada etapa do caminho para ter sucesso neste curso, certifique-se de que você entende o tópico abordado em cada vídeo e seria benéfico para codificar junto para cada vídeo da série. O projeto final deste curso usa muitas das habilidades que aprendemos e as aplica a um novo aplicativo com um conjunto diferente de requisitos. Obrigado por se inscrever neste curso, e estou ansioso para vê-lo no primeiro tutorial em vídeo
2. Como fazer sua configuração: A primeira coisa que precisamos fazer é configurar o código X. X Code é o principal ambiente de desenvolvimento integrado da Apple, e é o que vamos usar para todo este tutorial. Então, se você está em um computador Mac, se você vai para a loja de APP e você procurar por código X, deve ser a primeira coisa que aparece. Então queremos fazer é baixar o código X, e uma vez Ex Card é baixado, vá em frente e abri-lo e vai criar nosso primeiro projeto. A maioria dos cartões Ex é aberta e configurada. Vá para Criar um novo projeto e você será recebido com um menu que se parece com este. Certifique-se de que você está na seção IOS e vamos selecionar um único aplicativo de exibição. Você notará aqui que há alguns outros tipos de modelo, como uma página baseada em uma base de abas e alguns outros. Mas nossas intenções e propósitos queremos usar um único aplicativo de visualização, então vá em frente e aperte o próximo, e precisamos ir em frente e dar o nome a este projeto, então vamos chamar este Projeto um e você precisará selecionar uma organização e para uma equipe Vou colocar minha equipe não é nenhuma porque eu não estou usando nenhum perfil de desenvolvedor associado a isso agora para o nome da organização na organização. Identifique onde você pode criar um novo nome de organização que você acha apropriado em um identificador. Você também pode criar seu próprio identificador para isso também. Para o idioma que vamos usar Swift e para os testes de unidade aqui, vou desmarcar esta caixa. Nós não vamos estar fazendo nenhum teste neste interrogatório ALS Siri então, uma vez que tudo isso configurado, vamos em frente e vamos para o próximo e colocar o projeto em qualquer lugar que quisermos. E uma vez que tenhamos feito isso, podemos ir em frente e começar a dar uma olhada no que temos dentro desta estrutura do projeto. Então vamos dar uma olhada rápida em como o projeto está estruturado. Se formos aqui para o canto superior esquerdo. Este ícone azul é o que é conhecido como nosso arquivo Project, e contém praticamente todos os arquivos de código-fonte,
os arquivos de interface do usuário. Ele sabe onde cada arquivo em nosso projeto vive e tem uma referência a ele Quando selecionamos nosso arquivo de
projeto, vemos que temos uma seção aqui chamada alvos. Os alvos são basicamente o aplicativo. O aplicativo que estamos construindo é um aplicativo chamado Project One e um pacote de APP contém todo o recurso é e o código compilado que constrói nosso aplicativo em toda a lógica dentro dele . Assim, quando você seleciona o destino ou basicamente seleciona seu aplicativo, você pode ver que essas guias aparecem, como recursos gerais, configurações
criadas e fases de compilação. Há muitas informações diferentes aqui que talvez precisemos mudar ao longo do tempo. Mas, em geral, é onde você encontrará coisas como o nome de exibição do aplicativo, o pacote identifica onde a versão da equipe que você está usando para sua equipe de desenvolvedor, bem
como muitas outras configurações, como a implantação, destino, os dispositivos e assim por diante e assim por diante. Então muitas vezes temos que ter uma compreensão das coisas que podemos mudar aqui se tivermos que modificar as configurações do projeto para nossa aplicação. Voltando para a esquerda, temos nossos arquivos rápidos. Estes são os arquivos de código-fonte estavam escrevendo a maior parte da nossa lógica no aplicativo . Em seguida, temos o que é conhecido como um arquivo storyboard, e esta é a representação visual de nosso aplicativo. À medida que começamos a criar telas diferentes no APP, podemos adicionar diferentes elementos para você a este quadro de história para construir um layout visual de onde APP vai se parecer e como ele vai fluir. Além disso, temos o que é conhecido como uma pasta Ativos. Aqui é onde vamos colocar coisas como um ícone de aplicativo são ícones para diferentes recursos está em nosso laboratório e diferentes telas e visualizações, talvez uma imagem de perfil. Vamos colocar isso aqui, bem como outros ativos, passo ao longo do catálogo de ativos. Queremos ter certeza de que nosso projeto compila, constrói e roda em nosso simulador com sucesso, então para realmente executar o aplicativo. Se formos até aqui, vemos que temos este botão play que nos dá diferentes opções. Se clicarmos nele, temos a opção de executar para testar o perfil na aplicação do analisador. Então, antes de executá-lo, queremos ter certeza de que selecionamos o alvo do aplicativo, que é o Projeto um para o nosso exemplo como o projeto selecionado aqui. O alvo selecionado. Agora, uma vez que você tem isso, você deve ter uma opção de simuladores para selecionar. Eu vou escolher um simulador de iPhone SC apenas para rodar isso para ter certeza de que ele funciona. Se você não tiver nenhum simulador aparecendo por qualquer motivo, se houver um problema de instalação, você tem a opção. Aqui é você baixar simuladores, e se você clicar
nisso, ele irá levá-lo para a lista de tempos de execução simulados que você pode baixar. E quando isso terminar, você terá uma lista de simuladores que aparecem neste homem. Você cai para baixo. Assim que você selecionar seu simulador, vá em frente e aperte o botão play e isso vai compilar o projeto, construir nosso pacote de aplicativos e instalá-lo no simulador, e até agora parece que tudo está bom. Você pode ver isso, diz o lançamento do Projeto 1, e vamos dar a este minuto o minuto do simulador para inicializar e verificar se tudo está bom. Meu simulador está funcionando, e eu vejo um fundo branco, que é um bom sinal, e se voltarmos ao nosso quadro principal e selecioná-lo para que ele apareça aqui e nós voltamos e damos uma olhada no nosso simulador. O que estamos vendo em nosso simulador agora é a representação visual deste
controlador de visualização a partir do storyboard, você pode ver que não há elementos de interface você I neste controlador de visualização, como um campo de texto ou qualquer tipo de e é um fundo branco. E como este é o controlador de visão inicial, isso é o que está sendo apresentado aqui mesmo no simulador. Então agora vamos dar uma olhada mais profunda nos controladores de visualização e entender um pouco mais sobre como eles são o pão e manteiga de um aplicativo IOS.
3. Controle sobre os controladores de visualização: agora vá em frente, selecione o controlador de visualização dentro do quadro principal e vá até o
canto inferior esquerdo aqui. E certifique-se de expandir esta opção de menu descrito documento. E quando você fizer isso, você terá sua hierarquia de controle de exibição aqui, e você pode ver isso com o controlador de exibição dele. Ele contém uma vista, e um controlador de visão é o pão e manteiga os blocos de construção de um aplicativo IOS. Você pode pensar em um controlador de exibição como uma tela em um aplicativo que pode conter qualquer número de você elementos, como campos de texto e outras exibições e exibições de tabela. Assim por diante e assim por diante quando queríamos telas adicionais em nossa aplicação. Para a maior parte, vamos criar alguma forma de um controlador de visão, e vamos navegar do controlador de visão para o controlador de visualização, passando dados de um para o outro para navegar através do nosso aplicativo através do que é conhecido como Segways. E essencialmente, o controlador de visualização pode simplesmente é que ele é um controlador que controla visualizações, e esse é o seu trabalho na finalidade principal. Então, se quisermos adicionar elementos a um controlador de visão, o que podemos fazê-lo a partir de uma perspectiva de carimbo de storyboard é, se formos até aqui para a biblioteca de objetos e começar a olhar através da seleção selecionada de opções aqui, podemos arrastar elementos para a vista. Então, digamos que, por exemplo, eu queria adicionar um campo de texto que começa para Campo de texto e eu recebo uma opção aqui. E Aiken, arraste-o para o controlador de visão. E se você voltar e olhar para a hierarquia aqui, você pode ver que esta exibição contém uma exibição sub para um subcomponente. E esse é o campo de texto. E, em geral, é assim
que vamos projetar mais para vocês elementos neste curso. É ótimo para iniciantes. É visualmente fácil de ver, e representa o fluxo de nossa aplicação, e podemos avançar muito rapidamente fazendo essa abordagem. Então, agora que temos um entendimento básico, você
tem controladores trabalhando dentro de um arquivo storyboard, precisamos entender como eles se relacionam de volta aos arquivos de código-fonte. Então, se você for até aqui e você vai para o ícone do editor assistente e clicar
nele, ele vai abrir o painel lateral e nós podemos ter o nosso controlador de visão ponto rápido arquivo lado lado com o nosso controlador de visão do storyboard. E como nós meio que olhamos aqui, se selecionarmos nosso controlador de visão e voltarmos aqui para o lado direito e vamos para
a classe, Inspetor, você pode ver que há uma classe chamada controlador de visão. Então, por padrão, o controlador de exibição que é criado no projeto é automaticamente atribuído a este arquivo de
código-fonte aqui. E à medida que criamos controladores de visualização adicionais, temos que atribuir o arquivo de código-fonte para mapear para o controlador de visualização correspondente no arquivo
storyboard. Então vamos fazer isso como exemplo. Só para que você não entenda como realmente conseguir isso. Então volte aqui para a biblioteca de objetos. O que queremos fazer é procurar um controlador de visão e podemos arrastar esse elemento para o nosso storyboard aqui. E então agora temos um segundo você controlador. Ele não tem uma subclasse ou qualquer tipo de associação com arquivo de código-fonte. Vamos criar isso agora mesmo. Então, selecione um novo controlador de exibição que você acabou de criar e vá para o seu código-fonte. E sob sua pasta, clique com o botão
direito e vá para um novo arquivo e vamos usar um novo arquivo rápido aqui, e vamos chamar esse controlador de visualização de detalhes, e vamos continuar e criar esse arquivo. Agora, certifique-se de ter sua visão detalhada. O controle é selecionado aqui, e eu vou realmente trazê-lo para cima no meu lado direito. Se eu clicar neste menu e ir para arquivos recentes, eu posso olhar para o controlador de visão detalhada. Se você vir a interface, não clique nessa. Certifique-se de sair do que não diz interface. Então isso vai trazer o arquivo de código aqui no lado esquerdo. Vamos manter o nosso storyboard aberto e vamos em frente e fazer a associação entre este arquivo de
código e este elemento você aqui. Então precisamos realmente criar nossa classe. E fazemos isso importando na estrutura necessária que contém controladores de visualização. E o que faremos é importante. Vocês, crianças, explicarei em um minuto por que precisamos fazer isso. Portanto, precisamos criar o nosso controlador de visão de detalhes de classe, que deriva de você. Eu vejo controlador e vamos em frente e obter isso estruturado. E vamos adicionar um método aqui chamado View, fez carregar e vamos apenas fazer um super trabalho. Você carregou e vamos quebrar exatamente o que está acontecendo com o que acabamos de fazer. Então o controlador U I ver é das maçãs. Você eu kit quadro. Ele contém o nível básico que você controla que a Apple nos fornece para usar em nosso desenvolvimento de
aplicativos para Iowa. E basicamente estamos dizendo que há controlador de visão detalhada é é subclasse ing ou não subclasse ing, mas chega de você. Eu vejo o controlador. Então ele contém todas as propriedades e elementos lá que vem de você. Eu kit. Agora, como fazemos esta associação daqui até aqui? Bem, isso é muito fácil. Se você selecionar o controlador de exibição no storyboard e voltarmos para o
inspetor de classe aqui agora, temos a oportunidade de criar nossa subclasse. E então, se você vê aqui está procurando qualquer tipo de você tem você controlador e nós apenas acontece de fazer um chamado um controlador de visão detalhada para que possamos criar a associação aqui digitando em detalhe, controle de
visualização e você poderia see executa automaticamente preenchendo isso para nós. E outra coisa que queremos fazer aqui é criar um storyboard. Eu d. E geralmente o que todos usam o nome da classe como o nome do storyboard I d. E isso basicamente significa que quando estamos olhando para carregar o controlador de visualização programaticamente talvez possamos sempre procurá-lo pelo seu nome, que é o dedo do controlador de visão detalhada, carregá-lo no código. Então, uma vez que você tem que configurar, você agora criou o link entre o arquivo de código-fonte EUA nos
EUAno elemento U aqui. Então vamos dar uma olhada na carga vista. Se nós comando clique em você, você controlador e ir para saltar a definição. Aqui é onde podemos ver todos os diferentes métodos disponíveis que a Apple fornece para nós que podemos usar o de você. Você tem o seu controlador. Você pode ver bem aqui. É de onde a visão fez a carga está vindo. E diz aqui mesmo nos comentários chamados depois que a exibição foi carregada para exibição, controle é criado e código. Isto está atrás de muitos de vocês. E geralmente este é o lugar onde fazemos a maioria de nem todo o nosso código de configuração para a maioria das circunstâncias é quando este método é chamado. Portanto, é muito importante que substituamos isso em nossa subclasse para visualizar o controlador, e definitivamente estaremos entrando em mais desses métodos de ciclo de vida à medida que avançamos.
4. Seges e controladores de navegação: Agora vamos falar sobre Segways,
Segways ou como fazemos a transição de um controlador de visualização para outro controlador de visualização. E podemos fazer isso de algumas maneiras diferentes. E o que vamos começar é o que é chamado de Segway móvel. E para isso, queremos fazer algumas coisas. Então, a primeira coisa que queremos fazer em nosso detalhe de você controlador é vai mudar a cor da vista para que possamos distinguir visualmente qual controlador de visualização estavam em. Então, se você tiver seu novo controlador detalhado selecionado aqui, se você passar por cima e você encontrar a vista aqui e seletiva você e, em seguida, você vai para aqui, queremos selecionar a guia para os atributos. Inspetor, vamos até as vistas, cor de
fundo, e eu ia mudar de ideia para uma cor diferente aqui, possamos ver visualmente que esta é a tela de detalhes. Agora, a
fim de acionar o Segway, precisamos de algum tipo de botão clique onde você elemento que um usuário iria interagir com para passar de um para o outro. E nós podemos ir até a biblioteca de objetos aqui e procurar um botão e nós podemos arrastar esse botão sobre o nosso primeiro controlador de visão, e eu vou deixar o campo de texto que eu tinha lá de antes. E todos nós fazemos é colocar o botão no centro. Eu vou arrastá-lo para a frente, e eu estou ampliando um pouco a tela aqui e apenas tipo de aumentar a dentro da altura do botão e centralizá-lo. E se você passar por aqui com o botão selecionado, usamos em vez do botão de texto padrão. Bem, basta dizer onde e o que precisamos fazer a seguir é realmente criar a conexão para fazer o Segway. Agora, a maneira mais fácil de fazer isso é um construtor de interface, e fazendo isso, podemos segurar nosso botão seletor. Podemos manter pressionada a tecla de controle sobre a limpeza no teclado, clique e, em seguida, arraste para visão detalhada, controlador
e liberação, e você verá que temos uma Segway ação que aparece. Temos um show, um detalhe show, modo
presente cedo,
e, em seguida, temos estes não adaptável obsoleto ID Segways. Então o que vamos fazer é um show e você verá imediatamente que isso cria a conexão daqui até aqui. Então vamos rodar isso no simulador e ver exatamente como isso vai se parecer. Meus simuladores estão funcionando aqui. E não se preocupe se seus botões um pouco fora do centro, contanto
que você ainda pode vê-lo, tudo bem. Falaremos sobre como posicionar, bloquear coisas com layout automático mais tarde na série. Se agora, vá em frente e aperte o botão Segway e você pode ver que fomos para o nosso
controlador de visão detalhada , temos uma tela real aqui, mas infelizmente não temos nenhuma maneira de voltar para a nossa visão inicial controlador. Estamos presos aqui porque não temos como descartar o fluxo. Você vê, nós não temos nenhum botão de voltar ou maneira de descer. E este tipo de Segway é conhecido como um Segway móvel. Ele é usado para apresentar informações que ocupariam a tela inteira, e presumivelmente seria usado para capturar algum tipo de entrada do usuário como, digamos, digamos entrada
um formulário de registro, um registro informar sobre o que ainda tinha alguém para descartar o fluxo. Agora, obviamente, não
adicionamos um botão aqui, então estamos presos por enquanto. Agora podemos retificar isso facilmente com o que é chamado de controlador de navegação. Agora, o que você vai fazer em seguida é voltar para o seu quadro de história e selecionar o Segway real e excluí-lo. E o que vai fazer em vez disso é que vamos introduzir esta ideia de um controlador de navegação. E a maneira mais fácil de configurar este controlador de visualização com um controlador de navegação é selecionar o seu novo controlador, ir para o menu do editor aqui, ir para incorporar e, em seguida, selecionar controlador de navegação. E imediatamente. O que você vai ver é que temos este controlador de navegação que está apontando para o nosso
controlador de visão no topo. Aqui temos uma barra de navegação, e isso vai ser importante em um momento. Então, vamos repetir os mesmos passos. Nós vamos conectar nosso botão aqui para o controlador de visão detalhada aqui. Então, se mantivermos pressionada a tecla Control, clique e arraste. Temos a nossa acção. Segway subir e nós vamos fazer show e você vai ver agora que nós temos um botão de volta em nosso controle de visão detalhada que nós não tínhamos antes. Então vamos em frente e executar isso no simulador, e então vamos passar por uma discussão sobre controladores de navegação e o que exatamente está acontecendo aqui? Então, agora, se eu clicar no meu botão Segway aqui, você verá que vamos para o controlador de exibição de detalhes. Mas temos uma maneira de voltar. Temos um botão de volta, pressionamos o botão Voltar, voltamos. Se tivéssemos Segway novamente, vamos para a frente, e você também pode ver que a animação é diferente. É quase como se deslizasse para dentro, e outra coisa que você pode fazer aqui é se você meio que arrastar um pouco nas bordas, você tem a capacidade de arrastar para voltar também. E isso é apenas um recurso dos controladores de navegação que eles suportam por padrão, a menos que você o desative. E se você se lembra, o Segway móvel ou o primeiro segmento que fizemos veio de baixo e nosso controlador de
navegação, Segway desliza para o lado. Agora vamos cavar um pouco nos controladores de navegação. O controlador de navegação é um tipo de você eu vejo controlador. Na verdade, o controlador de navegação deriva de você, você
tem controlador, então ele herda todas as propriedades que tem você controlador tem, mas ele adiciona em uma barra de navegação e uma matriz de você controladores que o gerencia a pilha de navegação. Você pode pensar em Seguin entre os controladores de visualização como empurrando e popping controladores de visualização dentro e fora da pilha. A pilha interna dos controladores que contém o controlador de navegação. Então, por padrão, quando você adiciona um controlador de exibição através do storyboard e você se conectou através de um Segway. Seja qual for esse controle de visualização de detalhes,
ou qualquer outro controlador de visualização que deriva deste controlador de navegação, todos herdaremos a barra de navegação, que fornece um botão de voltar ou uma maneira de voltar a não ser que o desativamos para mudá-lo para fazer outra
coisa. Bem, então você pode se perguntar, que tipo de saquê esperar, eu uso fazer é um modelo ou eu uso um controlador de navegação? E isso realmente depende do fluxo de seus controladores em seu projeto e do que você está tentando fazer. Então, se você tem o controlador de visualização autônomo que você pode apresentar de qualquer lugar, e talvez ele vai coletar informações do usuário em um formulário ou em um tutorial ou um
logotipo splash ou algo que poderia ser apresentado, em
seguida, demitido. Um Segway modelo faria mais sentido agora em uma série de telas como esta onde você tem, ah tipo de um relacionamento pai filho ou um relacionamento de visão detalhada mestre do que ter um especialmente se eles precisavam Barra de navegação. O controlador de navegação faz todo o sentido porque você pode começar com uma visão e
aprofundar uma série de exibições que estão todas inter-relacionadas, e então você pode facilmente navegar seu caminho de volta para o controlador de exibição pai.
5. Entendendo os controladores da visualização da tabela: até agora nós tocamos em você, você
tem controladores e controladores de navegação, e nós temos um pouco de uma compreensão de como se mover em um aplicativo. Mas, a fim de construir um aplicativo de lista para fazer, precisamos basicamente de uma lista. Então, o que realmente precisamos em termos de uma lista para Iowa é uma exibição de tabela, e especificamente vamos usar um formulário especializado conhecido como a tabela de você controlador . Agora, uma tabela do seu controle é nada mais do que um especialista. Você tem você controlador que contém uma exibição de tabela em implementos, alguns dos métodos e funcionalidade que é necessário para uma tabela de você para exibir seus dados e para personalizar as células ou as linhas dos dados. Então, se descermos para a nossa biblioteca de objetos aqui, quando procuramos o controlador de vista de tabela, você verá que temos um que aparece na lista. E se formos em frente e arrastar que possui que a tela, podemos ver imediatamente que temos uma exibição de tabela, uma célula ou uma tabela que você vende, e isso é dado a nós por padrão, apenas usando uma tabela de seu controlador. E se selecionarmos nosso controlador de exibição de tabela aqui e entrarmos na hierarquia de documentos, se olharmos aqui e vemos que temos uma tabela de vocês, a célula real e, em seguida, a exibição de conteúdo dessa célula e é isso que vamos começar
para nossa lista de tarefas é que vamos começar a estruturar e configurar o nosso controlador de vista de tabela para que ele possa ser capaz de carregar o nosso para fazer itens de lista e nos permitir adicionar novos itens de lista e fazer seleções para aprofundar a vista de detalhes para itens que selecionamos da lista, assim como fizemos com o nosso controlador de visualização de detalhes. Queremos conectar um arquivo de código-fonte rápido ao nosso controlador de visualização de tabela correspondente aqui. Então vamos em frente e fazer isso. Agora vá para o arquivo do projeto aqui e para a pasta de código-fonte e clique com o botão direito na pasta e faça um novo arquivo e selecione um arquivo rápido. E eu vou chamar meu para fazer lista tabela de controle de exibição, e eu vou criar isso e imediatamente nós precisamos ir em frente e fazer o nosso habitual importante de você como ele, que contém a classe e todos os métodos e funcionalidades para controladores de exibição de tabela, bem como você tem que você tem controladores para e vamos fazer classe para fazer lista tabela exibir controlador. E ele vai derivar de você eu controlador de vista de mesa. E vamos substituir a vista fez olhar método, que será o nosso ponto de entrada uma vez que este controlador de visão carrega pela primeira vez. E assim que tivermos isso aqui, certifique-se de que está no editor assistente. Se o seu editor assistente estiver fechado, você poderá abri-lo apenas clicando no botão aqui para abri-lo. E vamos em frente e abrir nosso storyboard de um lado e eu vou colocar o meu do lado direito aqui e vamos apenas olhar, vamos ter certeza de que temos nossos controladores de visualização de mesa selecionados e vamos para o
inspetor de classe aqui e onde ele diz que você quer controlador de vista de tabela. Nós vamos mudar isso para o para fazer lista tabela controle vista. Também vamos copiar esse nome. Use-o para o storyboard i d. na restauração I d. para que possamos encontrá-lo pelo mesmo nome. E agora vamos realmente dar uma olhada no que você I table view controller tem para que você possa começar apenas que comandos clicando em você. Eu tomo o controlador de visão, que nos levará para a documentação para esta classe. Então, olhando para o seu controlador de visualização de mesa, podemos ver algumas coisas. Se olharmos para a hierarquia de herança e os protocolos com os quais ela se adapta, deriva de você, você controlou? Assim, imediatamente, EUA
A. EUA A. Com o controlador contém toda a funcionalidade ou herda a funcionalidade que o controlador de visualização expõe. Mas, além
disso, ele tem sua própria exibição de tabela, que é o que o torna o controlador de exibição de tabela, bem como implementar o
delegado de exibição de tabela em partículas de fonte de dados. E nós vamos chegar ao técnico em profundidade sobre isso por agora. Mas o que é importante saber é que este é apenas mais um especialista. Você tem o controlador que contém uma vista de tabela e nos permite fazer várias operações em elementos nessa lista na tabela de você. Então agora vamos voltar e começar a embaralhar algumas coisas em nosso storyboard. O que queremos Dio é substituir o nosso controlador de visão um com o botão Segway e removê-lo completamente. Nosso para fazer lista tabela exibir controlador vai tomar o seu lugar em vez. Então, o que podemos Dio é selecionar nosso Segways do controlador de visão para o detalhe e
vamos em frente e apertar a tecla delete para remover que, ao mesmo tempo, vamos excluir completamente este controlador de visão e seu controlador de navegação para que nós pode tipo de selecionar ambos e excluídos daqui. Às vezes é mais fácil se você selecionou da hierarquia vista aqui. E eu vou fazer a mesma coisa para o controlador de navegação. Agora, aqui no código-fonte do projeto. Eu também vou remover você controlador tão rápido. Não vamos mais usar isso. E vamos substituir isso pelo nosso controlador de visualização de tabela de lista, então vamos nos livrar disso por enquanto. E nós vamos trazer o nosso para fazer lista tabela exibir controlador de volta, e nós estamos indo para colocá-lo dentro de um controlador de navegação da mesma forma que fizemos com nosso controlador de visão tão selecionado vamos para o editor e, em seguida, vamos fazer incorporado um controlador de navegação. E agora, nosso controlador de visualização de tabela herdou uma barra de navegação e tem uma tabela sua. Então ele tem um monte de coisas que precisamos para construir uma lista para fazer. E uma outra coisa que precisamos lembrar de fazer é, se fôssemos executar isso agora, precisamos ter certeza de que temos que encontrar esses controlador de visão inicial. Então, neste caso, uma vez que o controlador de navegação é o primeiro elemento que vai ser carregado, certifique-se de que é o controlador de visualização inicial. E podemos fazer isso selecionando-o, passando para o inspetor de atributos aqui. E uma pequena caixa de seleção é controlador de visão inicial. Certifique-se de que você tem isso marcado e você vai saber porque você tem esta pequena seta cinza aqui indicando que este é o controlador de exibição inicial neste arquivo storyboard. E então vamos em frente e executar isso agora, e nós não vamos ver nada, mas vamos ter certeza de que tudo funciona em nosso simulador. Então eu olho para o que parece ser uma lista vazia. Meu controlador de exibição de tabela está em execução. É o controlador de visão inicial, mas não há nada nele. Eu posso meio que arrastar um pouco, e se você pode ver que minha exibição de tabela salta enquanto eu me movo, um, mas fora isso não é nada mais do que uma lista vazia com a barra de navegação no topo até começarmos realmente implementando o código para conectar nossa fonte de dados e exibir elementos na lista, e é isso que vamos começar a fazer agora.
6. Implementando a lista do TODO: agora, a
fim de criar qualquer lista, precisamos de itens para fazer para tarefas. Então vamos criar um modelo de dados que representa uma tarefa. E se formos para nossa hierarquia de arquivos de projeto aqui e vamos criar um novo arquivo
rápido para representar essa tarefa, então clique com o botão direito e faça o novo arquivo final bem rápido. E vamos chamar esse tipo de tarefa e vamos criar outro arquivo. Então volte para a pasta, clique com o botão
direito do mouse em Novo arquivo, e nós vamos realmente criar uma tarefa, então vamos chamar essa tarefa. Agora, o tipo de tarefa vai definir a categoria em que nossa tarefa vai cair. E isso será apenas qualquer newme do tipo de tarefa, e vamos criar categorias diferentes. Representa isto. Então talvez tenhamos um caso para estudar um caso para trabalho doméstico, um caso para revestimento, e pode ser um caso para planejamento de férias, e eu acho que isso é bom para agora. Então temos alguns tipos diferentes de tarefas que definimos para o que estamos interessados em
encontrá-lo para e agora vamos voltar para a tarefa que rápida e criar uma nova classe para representar esta tarefa de classe, e esta classe vai contêm algumas propriedades. Então vamos ter um título de tarefa. Vamos chamá-lo de Type String. Deixe a data de vencimento, a data do tipo e deixe o tipo de tarefa tomar. E uma coisa que vamos fazer aqui é torná-los privados para que o seu único contido
nesta classe. E então precisamos de um Isar inicial para injetar valores para cada uma dessas
propriedades privadas . Então você tem um Isar inicial e esse izer inicial irá conter uma força de tipo de título , uma data de tipo de data de vencimento em um tipo, a fita de tarefas e o que faremos dentro do corpo deste izer inicial é um sinal de cada um dos esses valores injetados para nossas propriedades privadas na classe, assim auto intitulado é igual a data de vencimento auto é igual a data de vencimento e auto. Esse tipo é igual a tipo e certifique-se de que não tem nenhum problema de compilação. Vá em frente e faça o comando ser ou você pode subir aqui para o produto e construir, e você vê que o comando ser é a tecla de atalho para representar isso. Vamos apenas ter certeza de que nosso código compilar com sucesso. Parece que sim. Então agora, com nosso modelo de dados configurado, precisamos ir em frente e criar instâncias de tarefas e adicioná-las à lista aqui para que
possamos vê-los visualmente representados como Rose em nossa exibição de tabela. Então agora nós precisamos realmente voltar para o nosso para fazer tabela lista de você controlador. E quando fazemos isso, precisamos realmente começar a escrever um pouco de código aqui. Então, imediatamente temos a nossa mesa no controlador. Que sub classes você I tabela ver controlador deriva a partir dele. E a primeira coisa que precisamos fazer é criar uma fonte de dados,
e a fonte de dados vai conter toda a rosa para uma exibição de tabela e vai definir que como este Privado, nossa fonte de dados do tipo A coleção de tarefas é igual a uma lista vazia para começar. E o que vamos fazer aqui é criar uma função privada, construir fonte de dados, e vamos chamar isso logo após a nossa visualização carregar. Então vamos chamar fonte de dados de construção aqui. Agora, o que este método vai fazer é criar um par de tarefas em anexá-los à nossa matriz
fonte de dados . Então o que vamos fazer aqui é fonte de dados que dependem. E nós vamos bem dentro disso, uma nova tarefa. Então vamos fazer a tarefa e vamos fazer o título para o 1º 1 estará estudando a programação de uma data de vencimento. E vamos usar a data de hoje para agora. Vamos limpar isso mais tarde. E para o tipo de tarefa para este será apenas codificação de pontos porque esse é o tipo que corresponde a esta tarefa. E eu vou copiar isso e colar isso Ah, cada duas vezes mais e nós vamos mudar a tarefa lá dentro. Então, para o próximo só vai fazer lavanderia e vamos mudar o tipo dois ponto trabalho casa . E para o final, uh, bem, dio-planejamento viagem para onde queremos ir. Hum, Espanha? Que tal girar jogando viagem para a Espanha e para o tipo ouvido vai fazer planejamento de férias. Então, fomos em frente e construímos nossa fonte de dados e agora a próxima coisa que precisamos fazer é implementar dois dos métodos aqui que nos permitem adicionar a fonte de dados à exibição de tabela e seguida, para cada linha vincular nossos itens de fonte de dados a cada célula de exibição de tabela. Então, se formos até o fim da nossa classe, vamos começar a gravar o número de filas na seção e você vê que isso vai meio auto-completar para nós. E vamos dar uma olhada no que está acontecendo nesta função ah Assinatura foram fornecidos uma vista de
tabela e foram fornecidos uma seção. E o que precisamos voltar é quantas rosas pertencem a esta seção da vista da tabela
e o que simplesmente vamos fornecer é devolver a contagem de ações da fonte de dados, que significa ódio. Há três itens na nossa lista. A nossa vista de tabela vai conter três filas. Isso é exatamente o que este método aqui diz. E isso é algo que a tabela de vocês tem que ter para saber quantos dados ela contém. Então isso é fácil. Podemos simplesmente devolver a contagem, e isso é tudo o que precisamos fazer para uma mesa muito simples de vocês. O próximo método que precisamos implementar é vender para linha no caminho de índice, e o que esse método faz é retornar uma tabela de você vender para cada linha de dados contida em nossa matriz de origem de dados. Então, o método real aqui, como eu começo a digitar, é auto para caminho de índice de linha e retorna. Você eu mesa de você vender. Então, se você puder entrar, eles vão falar sobre a função para nós e então podemos começar a trabalhar nisso. Então, olhando para a assinatura do método, temos uma tabela de vocês. Temos um caminho de índice e temos que retornar uma célula de visualização de tabela. E então o que vai acabar fazendo aqui é fazer Vamos tabela ver uma célula é igual à vista de tabela passada para nós dot de que célula reutilizável com identificador. E vou explicar o que isso significa no segundo então para o caminho de índice e usará o parâmetro de
caminho de índice aqui que foi passado. E você verá aqui que quando olharmos para a vista de tabela por isso é um tipo, e esse tipo é você. I tabela ver célula, que é a classe base para uma tabela que você vende. E então o que vamos fazer aqui é devolver a mesa que você vende, mas precisamos entender o que exatamente uma célula de visualização de mesa UI está dentro. A maneira mais fácil é sempre começar entrando na documentação da Apple. Então, se você selecioná-lo I tabela ver célula e nós comandos clique. Tinha saltado para a definição. Estamos agora dentro da documentação U I Kit para a classe que você quer tabela que você vende, e se
olharmos aqui, podemos ver que deriva de você, eu vejo que nós realmente não falamos muito sobre ainda, mas é a base visão de nível para a maioria de cada tipo de você que eu controle. E enquanto olhamos para baixo, podemos ver algumas propriedades de interesse. Há uma imagem. Você aí tem um rótulo de texto. Há um rótulo de texto detalhado, e há visualização de conteúdo, visualização de
fundo e algumas outras coisas aqui. Assim, os bits importantes, para nossas intenções e propósitos serão o rótulo do texto, potencialmente o detalhe, o rótulo do
texto e potencialmente a visualização da imagem. Então, imediatamente vamos usar a propriedade label de texto para realmente vinculá-lo o título de nossa tarefa. Então vamos voltar e começar a implementar isso agora e então precisamos fazer aqui é como
acabamos de ver uma tabela de você vender ou você I tabela ver Cell contém um rótulo de título ou um rótulo de texto . E se quisermos assinar o texto, precisamos fazer isso em uma tarefa específica. Então, o que sabemos? Agora mesmo? Temos um caminho de índice, e felizmente, um caminho de índice contém uma linha, e cada linha corresponde a seção ah em nossa matriz. Então, a maneira mais simples de fazer isso seria dizer, fonte de
dados no caminho do índice Não filmar e o que precisamos vincular. Bem, se
olharmos aqui, precisamos vincular nosso título. O problema é que definimos nosso título como privado para que não possamos acessá-lo fora desta classe. E então o que podemos fazer é simplesmente remover privado para título, que o torna de tipo, interno e fértil significa que a propriedade pode ser usada por todo o módulo, uh, ou basicamente todo o fora, Um, e meios privados Ele só pode ser usado pelo conteúdo dentro da classe. Nós sempre queremos padrão para privado porque é uma boa prática toe Onley expor propriedades para outras classes que precisam ser expostas. Não queremos expor tudo porque sempre abre oportunidades para outros programadores cometerem erros. Quando eles começam a usar nosso código, se darmos acesso a cada propriedade ou método de nossa classe que eles podem não precisar acessar. Então, é por isso que nos tornamos privados até precisarmos fazer algo um pouco menos restaurado, menos restritivo. Então, agora que este é um tipo de acesso interno, se voltarmos aqui, podemos então fazer fonte de dados no caminho do índice dot ro título ponto. Antes de executarmos tudo, vamos dar uma olhada na célula aqui que significa nosso identificador. Se voltarmos para o quadro de histórias, vamos trazer isso aqui e vamos fazer o editor assistente e manter a nossa lista de tarefas do controlador do lado direito aqui. E vamos em frente e selecionar a lista de tarefas para o seu controlador de exibição de tabela de controle e procurar a célula de exibição de tabela. Certifique-se de tê-lo selecionado e ir para o inspetor de endereços aqui e você verá que há esta seção aqui para re uso. Identifique o ar aqui. Eu vou usar o mesmo nome que eu usei no código, que será apenas vender nome muito genérico e vamos dar uma olhada rápida nesse método aqui . E uma vez que temos o comando options, clique nesta célula reutilizável deaky com identificador. Vamos fazer isso e ler a documentação e ver exatamente o que está acontecendo aqui. Então ele diz imediatamente que o mais novo é um novo método ridicu que garante que eles vendem, foi devolvido e recita corretamente. Assumindo que o identificador está registrado agora, também
há outro acima dele. Lá ele se transforma um opcional você I tabela ver célula que é usado pelo delegado para adquirir uma célula
já alocada em vez de alocar um novo. Essencialmente, tentando reutilizar um que esteja na memória e, se não estiver disponível, criando
um novo , nesse caso. Mas estamos usando esse método aqui. Razão para aquele que não retorna um opcional e basicamente o que esse ditado é se
tivermos mais tipos de células, vamos associá-las com identificadores diferentes para que eu possa ter uma célula para talvez, um, você sabe, uma célula de visualização da tabela de alimentação. Eu poderia ter um para um comentário ou, você sabe, como um ah,
uma célula de visualização de mesa publicitária. E isso pode dar a cada um desses identificadores diferentes e eu não posso dar todos os mesmos identificados porque eles precisam de algo que diz exclusivamente Este é um
tipo particular de célula contra o outro para que eu possa de que o certo. Então é por isso que queremos definir esse identificador aqui e também no storyboard para o tipo de célula para o identificador aqui e certificar-se de que eles correspondem. Agora, vamos em frente e executar nosso projeto para ver como tudo parece até agora e parece que tudo está funcionando. Posso ter três. Eu tenho três itens na minha tabela exibir minhas, uh, três tarefas que eu defini aqui na fonte de dados, e com certeza, que todas aparecem muito bem em nossa exibição de tabela.
7. Como conectar o controlador de visualização de: então a nossa tabela de lista para fazer está funcionando muito bem. Mas queremos ser capazes de passar esses dados para a nossa visão detalhada aqui. E talvez queiramos mostrar mais informações ou ter um layout diferente para cada tarefa em nossa lista. Por isso, neste momento não temos como passar da nossa lista para a nossa visão detalhada agora mesmo. Então, o que vamos fazer é ir em frente e ligar a lógica para mover para a tela de detalhes quando
selecionamos uma linha específica em nossa lista de tarefas. E a maneira mais fácil de fazer isso é voltar ao conceito de Segways. Oh, estão criando uma transição Segway após a seleção de nossa exibição de lista para a exibição detalhada, é bastante simples. O que podemos fazer é se voltarmos em um seleto nosso para fazer lista controle de exibição tabela, vamos voltar para o esboço do documento aqui, queremos obter um porão da célula. Então, com o auto selecionado, poderíamos fazer algo semelhante. Onde mantemos pressionada a tecla control, clicamos e arrastamos para o controle de visualização de detalhes e para o tipo de Segway vamos usar um show. E aqui você verá imediatamente que herdamos a barra de navegação do
controlador de navegação que encapsulam SAR para fazer este controlador de visualização, que tem um botão voltar para voltar e essa conexão foi estabelecida. Mas ainda há uma coisa que precisamos fazer diligências. Precisamos ser capazes de enviar os dados ou basicamente nossa tarefa, o teste selecionado daqui até aqui. E agora
mesmo, mesmo com o Segway dito, não
temos como fazer isso. E isso é algo que vamos ter que implementar isso em código. Então vamos precisar fazer isso em dois lugares. Vamos começar primeiro com o controlador de visualização de detalhes. Então vamos entrar nos detalhes do seu arquivo Controller Swift, e nós vamos dio é criar uma propriedade. Vamos chamar essa tarefa de Laura Task Type, e será opcional. E o que vamos fazer é carga imputada, que será chamado direito Quando entrarmos neste controlador do fazer, vamos apenas imprimir o tasker de impressão. Vamos desembrulhá-lo só por segurança. Se deixar tarefa é igual a tarefa de impressão de tarefa DOT Título e vamos fazer a seguir é voltar para o nosso para fazer lista tabela de exibição controlador e, uh ,
bem, ir em frente e implementar um novo método que ainda não vimos, que é chamado Prepare-se para Segway. E este é um método que vamos substituir. Se você selecionar o método aqui, deixe-me ver se eu posso puxar a documentação. Pode não dizer nada imediatamente,
mas deixe-me ver se podemos pular para a definição aqui. Pode não dizer nada imediatamente, Parece que não consigo ver, mas isto é chamado quando o Segway está prestes a acontecer. E então este é o ponto no tempo em que se quisermos passar dados ao redor para o próximo controlador que vamos, temos a oportunidade de fazê-lo aqui. Se você olhar para os parâmetros para este método, você tem o Segway real, que é um storyboard US Segway. E então você tem o remetente, ou basicamente o que enviou a chamada? Qual foi o elemento que foi explorado que invocou toda esta cadeia de operações para nós? Vai ser o você uma mesa para você vender porque isso vai ser o que o usuário
selecionou . Isso começou a transição para o Segway. E é por isso que seu tipo pode ser qualquer, porque qualquer tipo possível pode ser algo que desencadeou isso. Então nós temos que lançá-lo, especialmente quando sabemos que estamos esperando que uma tabela de suas células de tiro
fosse selecionada para que possamos desembrulhar e obter a nós mesmos e, em seguida, obter o caminho de índice de nós mesmos e eles obtêm os dados para essa estrada particular e, em seguida, enviar que sobre o destino fazer controlador. Agora, o Segway tem também tem um destino Segway propriedade. E você pode ver aqui que é um tipo. Você tem o seu controlador. E é para aqui que vamos. No nosso caso, isso seria controlador de visão detalhada, e por isso é como vamos passar os dados. Então, o que acabará por fazer aqui é fazer isso com vocês coisas. Hum, se deixar célula selecionada é igual ao remetente como você eu tabela ver célula. E na verdade, não, nós vamos. Acredita na declaração dos guardas aqui porque se não conseguirmos isto, não
nos importamos em fazer mais nada. Você simplesmente voltará. Então vamos vigiar e vamos deixar que sejam selecionados. Selby, o centro como um US capaz de você vender se não podemos obtê-lo, temos resgate assumindo que conseguimos, mas podemos então fazer é deixar o caminho de índice selecionado é igual a exibição de tabela, e estamos usando a propriedade de exibição de tabela para o tabela de seu caminho de índice de ponto do controlador para a célula. E assim vamos fazer é passar na célula selecionada. E estes métodos basicamente ah, método disponível na vista de tabela para obter um caminho de índice. É uma espécie de método de conveniência. Há alguns outros aqui para indexar caminho para linha em um caminho de índice de ponto específico para uma célula fornecido uma célula particular e caminhos de índice para Rose em um Tennessee dirigido no aviso aqui que essas opções de retorno. Então temos que verificar também para ter certeza de que estamos voltando sobre o caminho de índice aqui. Ou podemos ter uma falha de tempo de execução se forçarmos a desembrulhar algo sem valor. Então também faremos outro guarda. Deixe verificar aqui guarda, Deixe o caminho de índice selecionado não retornar. E assumindo que tudo isso funcionou, vamos fazer mais uma verificação aqui, e isso vai ser, hum, tudo bem, deixe o destino você controla um controlador de visão diesel igual a segway dot destino você controlador como o tipo de detalhe, controle de
visualização e eu vou realmente usar um se deixar aqui. Ainda assim,
acho que não vai importar,
mas bem,
nós podemos fazer qualquer um acho que não vai importar,
mas bem, mas bem, ou então virar neste ponto assumindo que tudo deu certo, você diz, Controlador obscura Tarefa é igual. Então agora precisamos descobrir,
OK, OK, temos o caminho de índice selecionado e o caminho de índice selecionado tem uma propriedade nele chamada
Roe e isso realmente nos dá a linha em basicamente nossa matriz para onde o item existe. Se te lembrares, exactamente o
que fizemos para ligar o nosso título a uma cela. Fizemos exatamente a mesma coisa. Nós usamos a fonte de dados no ponto caminho índice escreveu para obter esse item, e vamos fazê-lo exatamente a mesma coisa aqui em baixo e preparar para Segway para que possamos atribuir a tarefa para os nossos convidados são controlador de visão detalhada com base no índice selecionado caminho, remar para nós mesmos e é isso. Então vamos em frente e construir isso e verificar se nós construímos e ele precisa ser o selecionado em seu caminho que mais uma vez e tudo está bem. E agora mais uma coisa que podemos fazer aqui, mas antes de corrermos. Este é, uh, um princípio básico de depuração é,
ah, ah, conceito de usar pontos de quebra. Às vezes, se você quiser percorrer seu código para ver se as coisas estão funcionando ou não como esperado, você pode ir até aqui na barra lateral se você não tiver seus números de linha visíveis. O que você pode fazer é entrar em código X em preferências, e eu acredito que está em Ver aqui. Onde é que é isso? Em fontes e cores, números de linha de edição de
texto. Então, sob números on-line de edição de texto, você pode falar tudo isso dentro e fora para ver o número de linha específico onde você deseja um
ponto de interrupção . Uma vez que seus números de linha foram ativados, você pode ir até aqui nesta coluna do lado esquerdo e clicar em um pequeno lugar de
pontos de quebra . Assim que isso for carregado, podemos ver o caminho da execução e testar as coisas que eles estão trabalhando como esperamos. Então agora vamos em frente e executar isso no simulador. Vou em frente e selecionar programação estudando. E assim parece que o nosso Segway completou. Nosso controlador de visão detalhada acabou de ser chamado. Você fez o carregamento foi chamado e agora estamos verificando para ter certeza de que somos capazes de passar a tarefa que desembrulhar foi bem-sucedida. E com certeza, o programa de
estudo está sendo impresso para o console. Então, temos passado com sucesso a nossa tarefa da nossa lista de tarefas para o nosso controlador de visão detalhada .
8. 7. Subclassing UITableViewCell: até agora está começando a se unir. Mas ainda precisamos fazer mais algumas coisas para torná-lo bonito e entender alguns elementos mais comuns para o desenvolvimento de interface de usuário no IOS. Mas para
começarmos, queremos voltar ao tema da subclasse. Então, obviamente, nós subclasse Tara controle de visão detalhada aqui. Se você se lembrar, atribuindo sua classe ao controle de visão detalhada, e podemos fazer isso com
muitos, muitos, muitos elementos em classes especialmente de Iowa de você gosta e a próxima classe, queremos uma subclasse que nos permitirá fazer mais. A personalização está na nossa célula de visualização de tabela real. Então, se formos até aqui e expandirmos o nosso para fazer tabela de lista do seu controlador e
ex-célula eleita e formos para o inspetor de vidro aqui, você pode ver que agora as aulas só você eu tabela de você vender não foram designadas . Não foi subclassificada. Não há nenhuma maneira que possamos realmente ajustar ou adicionar. Testar são ações para esta célula, e isso é realmente algo que queremos fazer agora. Então o que vamos fazer é voltar para onde nosso código-fonte está na pasta do projeto ou
clique com o botão direito , e vamos criar um novo arquivo, e vamos chamar isso de nosso para fazer a visualização de tabela auto. Na verdade, vamos fazer a exibição de tabela de tarefas para um pouco mais concisa, não clique, crie, e vamos em frente e importar e o necessário Você gosta, que contém a célula de exibição de tabela. E, em seguida, vamos definir a nossa classe classe classe tabela tabela célula, que deriva de você I tabela ver célula e vamos em frente e obter
que configurar exatamente assim para agora. E o que vamos fazer aqui é voltar para o nosso storyboard. E agora que criamos uma célula de visualização de tabela de tarefas, podemos então subclasse nós mesmos no arquivo storyboard real. Então, se nós mesmos selecionamos e vamos voltar para a classe aqui, podemos fazer a célula de visualização de tabela de tarefas e tinha entrado lá para garantir que ele sai. E essa subclasse acaba de ser definida. E outra coisa podemos fazer o que estava aqui. À medida que começamos a adicionar arquivos mais rápidos, queremos tentar manter nosso projeto meio agradável e organizado. Então o que eu vou fazer é começar a criar pastas e se você clicar com o botão direito na pasta do projeto aqui para o nome da pasta Projetos e ir para o novo grupo. Mas você pode fazer é começar a criar pastas para colocar esses pedaços de código-fonte. E assim enfraquecer Dio, por exemplo, de vocês controladores. E podemos tomar o nosso controlador de visão detalhada e por turno, puxando a tecla Shift e Clicando Semana e, em seguida, selecione tanto o detalhe eo a fazer lista tabela que você controla. E podemos, em seguida, arrastá-los para a pasta Controllers view e que irá movê-los diretamente para o lugar certo lá. E nós também vamos fazer aqui é fazer outro para um grampo de mesa de vocês mesmos. Então a tabela poucas células e nós vamos tomar nós mesmos nós acabamos de criá-lo vai arrastar isso para a tabela de vocês mesmos pasta assim, e eu vou fazer uma coisa para modelos ou nossos modelos de dados. Então, sendo dois modelos e nós podemos levá-la nossa tarefa e podemos colocar isso lá, e então nós podemos apenas tipo de ter uma pasta geral para utilitários ou apenas, uh, tipos de lugares onde nós realmente não temos nada bem definido, mas é usado em outros lugares, como nossa altura de tarefas. Então eu ia criar uma pasta chamada Utility. Você sabe, basta colocar o tipo de tarefa lá. E então parece que temos tudo organizado aqui na maior parte,
com o nosso código-fonte. Você também pode clicar com o botão direito na pasta e dio classificar por nome se você preferir alfabética, e eu vou tipo de dar tudo uma boa ordenação alfabética para fora sua estrutura de projeto. Em seguida, queremos nos concentrar no estilo, são Task Cell. E se você voltar para a lista de entrevistas, controle de vista de
mesa e você se lembra disso bem aqui quando estávamos realmente Deke Ewing o celular em devolvê-lo. Estamos atribuindo esta propriedade de rótulo de texto aqui, que está vinculando o texto. Mas se você voltar e olhar para o quadro de histórias, não
é realmente claro que algo está acontecendo. Você tem que inferir que está acontecendo no código e ser meio legal se pudéssemos
representar visualmente tudo do nosso storyboard aqui para que não tenhamos que cavar o código para ver o que está acontecendo, e eu posso apenas olhar para isso até Isso. Certo, tem uma etiqueta aqui. Haverá texto vinculado nesta cela. Posso movê-lo, posicioná-lo, mudar a fonte,
a cor, a cor, tudo assim por diante e assim por diante. E então esse é o próximo passo que queremos dar. E assim para fazer isso vai exigir um par de passos. Hum, se notarmos aqui em nossa hierarquia de debaixo da tabela em nós mesmos que nós temos essa visão de
conteúdo. Então, digamos, por exemplo, que eu queria fazer algo como apenas mudar a cor de fundo, que de branco para outra coisa, e eu vou em frente e mudá-lo para amarelo eso agora você pode ver que aparece visualmente na visualização de conteúdo da célula. Então, se rodarmos isso em nosso simulador, vamos em frente e ver o que parece ser uma célula amarela. E com certeza, mudamos a cor. Bem, se quisermos mudar a altura da cela? E se quisermos que a cela seja um pouco mais alta? Então, à primeira vista, achamos que podemos simplesmente arrastar isso para baixo e, você sabe, fazer mais alto. Parece que funciona bem. Vamos em frente e correr no simulador e Ah, e vamos ver o que acontece em um momento aqui e olhar para isso. Não fez uma mudança. Então, o que está acontecendo aqui? Precisamos diagnosticar isso. Ah, parece que há outra configuração que está sobrepondo a altura da nossa célula, e isso é algo que precisamos mudar. Para suportar a altura desejada do construtor de interface, volte para o controle de exibição de tabela de lista para fazer. E há outro método aqui que precisaremos usar outro método que precisaremos
substituir . Então, se você se lembrar, número de linhas e seção foi o que nos dá de volta a quantidade de dados na tabela e caminho de índice auto estrada nos dá de volta uma visão de tabela real. Sell Well, acontece que há outro método. Altura para linha no caminho de índice que retorna SCG float, e o que queremos fazer é descobrir de onde isso está vindo e tipo de entender o que está acontecendo com ele. Então, se nós realmente comandos clicar no controlador de exibição de tabela U I, podemos ver que há esses dois protocolos Você I tabela exibir delegar E você eu tabela exibir fonte de
dados. Agora, você não é capaz de fontes de dados de onde o número de linhas na seção e
caminho de índice de estrada automática veio. No entanto, você tem um representante de exibição de tabela contém outras coisas relacionadas à personalização de nossa célula e altura. Sulco é uma das coisas. Então, se começarmos a digitar altura para linha no caminho do índice, você pode ver isso aqui. Esse é um dos métodos que podemos anular. E há uma descrição muito longa recebida
, mostra que aqui vem à tona. Às vezes faz, às vezes não. Mas podemos ver aqui que este é o lugar onde esse método está realmente vindo. E parece que me levou para a versão objetiva c deste,
uh, uh, ap I fora deste framework, que é bom. Mas se você rolar por aqui, há muitos outros métodos que podemos substituir além disso. E então eu quero dizer, há um monte de personalização enfraquecer dio em uma mesa de vocês, mas vamos voltar e e apenas para esclarecer mais uma vez, porque nosso controlador de visualização de tabela está em conformidade com esses dois protocolos. Ele nos permite substituir certos métodos para fazer a personalização em nossos próprios controladores de visão, que é exatamente o que estamos fazendo no para fazer lista de tabela exibir controlador. Então, se precisamos retornar uma altura para uma venda, bem, então provavelmente precisamos saber o que essa altura deve ser, Qual o valor numérico deve ser que retornamos de volta. Então, de uma forma, podemos fazer isso e combinar com nossa expectativa visual é se voltarmos no storyboard aqui e selecionarmos essa célula e vamos até aqui para este ícone que se parece com uma régua do inspetor de tamanho, Hum, ele tem uma linha atributos de altura aqui que podemos definir e arrastar para cima, cima e para baixo assim. Então vamos apenas dizer que eu quero que esta estrada seja e não sei, 145 e altura. Então com esse número, com esse número definido aqui, esse é o número que precisaremos retornar em altura para o caminho do índice da estrada. Então aqui nós vamos apenas retornar 1 45 Agora, vamos em frente e executar isso e ver como ele se parece com essa altura e porque
eu preciso realmente colocar a palavra-chave de substituição aqui porque nós estamos substituindo este método em nosso Implementação. Então vamos executá-lo. E então nós temos nossa altura agora, mas você vai ficar tipo, ok ,
bem, por que é coisa branca acontecendo? O que é isso tudo? E 11 outros truques de depuração visual que podemos usar é que há um ícone aqui se você ver onde meu cursor do mouse está no código X. E se nós, se clicarmos que ele nos leva para a hierarquia de visão do nosso aplicativo vivo. E se começarmos a clicar por aqui, podemos ver vários elementos da nossa estrutura. Se expandirmos aqui à esquerda, você pode ver que os odiadores, nosso controlador de visão. E se descermos, há uma vista de mesa e aqui está uma célula, e então por diante e assim por diante. E se nós realmente
clicarmos, podemos ver que Oh, essa é uma tabela que você rotula bem aqui. Então parece que os rótulos estão sendo esticados e isso parece um pouco estranho, certo? Então voltamos para o nosso código, descobrimos, OK, bem, onde temos que assinar essa etiqueta. E por que está sendo esticado tão alto? E vemos bem aqui que é aqui que estamos realmente atribuindo nosso texto ao rótulo. Então vamos apenas comentar e executar o AP mais uma vez. Então isso vai construí-lo fresco e ver o que isso muda. E agora, mesmo que não estejamos vinculando o texto, você não vê mais essa etiqueta branca. Ele se foi porque nunca está sendo designado. Vamos acabar usando nossa própria gravadora. Nós não vamos usar o rótulo padrão real na célula. E em vez de devolver apenas um você uma tabela de vocês vendem, vamos retornar a célula tipo de tarefa ou a célula personalizada que criamos para que possamos fazer clientes asiáticos em vez disso.
9. Como introduzir o layout automático: Então, vamos começar adicionando nossos próprios rótulos para nossa venda bem em uma etiqueta para o título. E eu acho que Lata rótulo para o tipo A inchar para começar. Então o que podemos fazer aqui é começar a ir até a biblioteca de objetos aqui no
lado direito e começar a digitar rótulo. E, uh, nós vamos arrastar uma etiqueta sobre o nosso storyboard aqui, e, uh, vamos em frente e obter que configurar e nós vamos dio é bem arrastado os cantos aqui para aumentar o dentro do Altura. Que tipo de traz para as bordas? Essas pequenas linhas pontilhadas são um tipo de guias de layout que lhe dizem onde você deve tipo de parar. Um, Dragon Beyonce porque isso seria fora do, você sabe, as diretrizes recomendadas para as diretrizes de estilo de interface de usuário que para a Apple fornece . Mas o que podemos fazer aqui é tentar fazer com que alguém pareça com isso. E se você for para o inspetor de atributos, podemos começar a mudar o tamanho da fonte e o posicionamento da cor para que eu possa mudar meu posicionamento de Teoh justificado
à esquerda no centro. Eu também posso mudar minha fonte real se eu quiser fazer isso por padrão. É diversão de assistente. Mas se você for sob costume aqui, , podemos começar a escolher para fazer coisas diferentes. Acho que vou tentar um dedo diferente. Deixe-me ver se há algo aqui que eu gostaria de usar. Isso parece bom. Ah, dio. Na verdade, acho que vou ficar com ele e vender isso. Eu realmente não vejo nada lá dentro que me interesse. Vou mudar para Ah, ousado. Que tal isso? Hum, isso é bom. E eu vou aumentar o tamanho um pouco aqui, e eu acho que isso deve ser bom para aquele. Hum, e nós também vamos fazer a mesma coisa para o tipo, e nós vamos apenas ir em frente e colocar esse tipo de bem abaixo. Então vamos arrastar outra gravadora. E, na verdade, em vez de arrastar outro rótulo pode ser mais fácil copiar o que temos. Apenas faça o comando, viu? E se você mover o cursor em qualquer lugar da célula e obter comandos V colar, podemos colar o que acabamos de copiar. E se quisermos mudar isso para ser um submarino aceso como uma legenda em vez de
um título,
podemos ir. um submarino aceso como uma legenda em vez de
um título, um título, E em vez de ousado, faça-o Ah, vamos ver que luz o que parece. Sim, acho que posso trabalhar. Hum, você pega esse conjunto lá e posiciona-o de acordo. Então, uma coisa que precisamos falar é sobre o que é conhecido como layout automático. E é basicamente um sistema de layout baseado em restrições que nos permite criar interfaces de usuário adaptáveis ,
interfaces que responderão às mudanças, como a orientação do dispositivo ou o próprio dispositivo. Você pode estar executando em um iPhone, SC, um iPhone sete plus e iPhone 10. Há muitos, ou até mesmo um iPad. Há muitos dispositivos e tamanhos de tela diferentes que temos que considerar ao projetar nosso APS, e é aí que o layout automático entra em jogo aqui. Então, se vamos entender alguma coisa sobre restrições, precisamos entender como aplicamos essas restrições do storyboard ou do construtor de interface? E então você provavelmente já me viu em algum momento fazendo algumas coisas aqui com talvez horizontalmente e verticalmente e recipiente para centralizar as coisas. Mas é aqui que começamos a entrar em nossos constrangimentos a partir daqui. Então, se selecionarmos, por exemplo, nosso título rotulado e descermos a este pequeno ícone aqui para adicionar novas restrições, também
temos opções aqui . Basicamente constrangido. Você está elemento ou nosso rótulo a uma certa quantidade de pixels ou pontos de distância do topo? O esquerdo, o direito na parte inferior, Estes ar, também conhecido como o lado principal no lado direito, temos restrições para adicionar um fixo com o aspecto de altura fixa reedição. Há muitas coisas aqui que podemos mexer. E o layout automático às vezes pode ser frustrante para novos desenvolvedores. Leva um pouco de tempo para dominá-lo e para tipo de entender como adicionar restrições que não entram em conflito com restrições e outros elementos. Então, uma coisa útil que a Apple adicionou é sobre este ícone aqui. Há uma maneira de resolver problemas de layout, e geralmente lhe dá uma maneira de definir restrições sugeridas para que você possa ter um tipo de definir
automaticamente coisas para você, Hum, que você pode não ter sido capaz de descobrir por conta própria. E quando auto deixar seleções foram feitas. Se você for até aqui, e entrar na sua mesa. Se você vender sua exibição de conteúdo, você verá agora que você tem uma pequena seção aqui chamada restrições, Eu preciso expandir que você pode realmente ver cada restrição individual na coleção de restrições. Você sabe, você tem a direita, o topo, o líder e, uh, você sabe que você pode Você pode inspecionar todos os valores que aparecem no atributo que o Inspetor aqui nem fez modificações a eles, se você quiser. Mas o que queremos fazer é mantê-lo muito básico. Então o que faremos pelo nosso é adicionar o nosso manualmente. Não vamos fazer o jeito preferido da Apple. Então vamos selecionar o nosso primeiro rótulo. Vamos descer aqui, e o que vamos fazer é aplicar uma restrição superior, uma restrição à esquerda ou à esquerda, uma restrição à direita e uma altura de 44 e adicionar quatro restrições. E então agora, basicamente estávamos dizendo que se nossa célula se expande em altura, são rótulos basicamente vão ficar fixos e fixados no topo desta célula, não vai realmente ir a lugar algum agora vamos em frente e aplicar lógica semelhante ao nosso legenda abaixo. Nós vamos selecioná-lo, você sabe, volta aqui, e nós vamos adicionar nossas restrições. Então, em vez de fazer um topo, eu acho que nós vamos tentar fixar este um no fundo da célula para que nós vamos fazer uma
restrição inferior de zero direita direita ou zero na restrição inicial ou esquerda de zero em uma restrição oculta de 44. Então isso vai consertar a altura e tipo de pino que vendem para o fundo. E assim, até agora, tão bom. Hum, nós mesmos, estamos parecendo muito bem. Agora vamos em frente e executar isso e ver como ele fica visualmente em nossa mesa de vocês em. Uma coisa que precisamos fazer aqui é ter certeza de que você comentou onde você
atribuiu seu texto aqui. Caso contrário, isto vai anular qualquer coisa. Fizemos um construtor de interface, então vamos em frente e executar isso no simulador e C sem definir o texto. Isto é o que nós meio que temos. Temos nossa etiqueta de título aqui e somos um rótulo de legendas abaixo e posicionamos exatamente como nós
os configuramos no Construtor de Interface. E assim eu decidi. Bem, você sabe, eu vejo que eu meio que coloquei meu rótulo no fundo aqui, mas eu acho que ficaria um pouco melhor se eu aumentasse um pouco mais. E assim podemos fazer isso com bastante facilidade. Se voltarmos aqui para aquele pequeno ícone de régua para o inspetor de tamanho e clicarmos nele, o que podemos fazer é ajustar o eixo Y um pouco movendo-o para baixo. Na verdade, traz a nossa gravadora. Então, se começarmos a clicar para baixo, acho que o meu estava em 90. Se vamos dizer que levem para o Lago 75 meus homens podem parecer um pouco melhores. Você vai ver que eu estou pegando toda essa coisa laranja aqui. E isso é basicamente a Apple me dizendo:
“Ei, “Ei, você tem algum problema aqui? Disseste algumas restrições que diziam que esta coisa passa a ser o eixo Y de 90. Você acabou de se mudar para 75. O que está acontecendo? Então dar-lhe algumas opções, você pode atualizar as restrições, que significa que suas restrições, em vez de esperar estar em 90 será um 75 que irá resolver esse problema. Você pode atualizar o quadro do rótulo para corresponder às restrições. Agora, se fizéssemos isso, as restrições estão em 90. Bem, só
mudamos tudo para 75. Se atualizarmos o quadro para corresponder à restrição, ele realmente se moverá. São rotulados de volta para baixo para 90 s. Nós não queremos que onde podemos deixar Apple re calcular as restrições inteiramente em fazê-lo para nós. E então nós realmente não queremos fazer isso porque esse tipo de derrota todo o propósito do que fizemos. Eso Outra opção para é que você pode fazer essas alterações aqui uma ondulação tão tempo para voltar para baixo para a garrafa de resultado um problemas que você também tem que opções, você atualizar a restrição, Constance. Isso é realmente o que queremos. Porque se fizermos
isso, ele basicamente diz que a restrição para hey, esperar que esta coisa seja em 75 não em 90 e então você verá que esse aviso acabou . E agora vamos fazer isso e ver como ele se parece. E isso parece um pouco melhor. Bom o suficiente para o que queremos fazer agora. Outra coisa que você pode perceber é como se houvesse uma linha divisória aqui. Esse tipo de olhares faz isso agora que começamos a mudar um pouco do estilo e seria bom se pudéssemos desligar isso e acontece que podemos, na verdade
é uma propriedade da vista de tabela. Então, se voltarmos para o storyboard e selecionarmos a exibição de tabela aqui e, em seguida, ir para o inspetor de atributos aqui, há uma propriedade chamada separador que ele disse para um valor padrão. Eso O que podemos fazer é transformar isso de padrão para nenhum se escolhermos fazê-lo. E se fizermos isso agora, vamos ver como isso se parece. Então você vê agora que esse separador está completamente desaparecido, hum, digamos que queremos adicionar nosso próprio, hum ,
separador, talvez um pouco mais grosso que parece um pouco maior. Poderíamos fazer isso de novo e de novo. É outra oportunidade para praticar usando um monte de layout. Então, em vez de um rótulo, o que vamos fazer aqui é procurar por você, ter você e é apenas uma vista simples como esta. Vamos arrastar isso para a visão de conteúdo de nós mesmos e vamos tentar trazê-lo aqui. E o que vamos fazer é fazer com que isto seja realmente pequeno arrastado. Eu acho que uma altura de ah, talvez oito vai ser bom por agora e de currículo em um pouco porque eu estou sentado na minha pista. Eu vou arrastar as bordas desta vista todo o caminho para a borda deste tempo não para as diretrizes
recomendadas para tipo de criar nossa própria barra divisória pouco. E o que eu vou fazer aqui não é uma posição que direito eu vou ir em algumas restrições para ele, para fixá-lo no fundo e fixar essa altura tão semelhante Então o que nós fizemos para o
rótulo de legendas . Eu vou fazer uma restrição de zero na restrição inferior de zero para a direita ou a
direita em uma restrição de zero para a esquerda ou a esquerda e uma altura de oito. É sobre fazer aquele amor que fixou exatamente onde queremos. E também vou mudar a cor desta vista para outra coisa que não seja branca. Então, se eu chegar ao inspetor absoluto aqui, eu acho que preto provavelmente ficaria muito bem. Aqui está para que possamos fazer com que pareça assim. Então agora vamos rodar isso mais uma vez e ver como isso se parece visualmente em nosso simulador . E talvez essa barra seja um pouco grossa demais, então tudo bem. Nós podemos simplesmente ir e ajustá-lo exatamente como fizemos em atualizar nossas restrições ao longo do caminho. Então, novamente, outra oportunidade para praticar no layout. Podemos deixar isso apertado para baixo de talvez sete Teoh de oito para talvez antes parecesse um pouco melhor. E vocês notarão aqui que minhas visões divididoras aumentaram enquanto eu diminuí a altura . Então nós vamos querer dedo do pé se nós se nós diminuirmos a altura em quatro, nós não iria empurrá-lo para baixo por quatro no eixo Y. Então você pode fazer isso daqui, se você quiser. Ou você pode simplesmente apenas tentar arrastá-lo para baixo como este, , e você pode colocá-lo direito na borda lá, e você ainda vai ter aquela laranja porque você acabou de fazer alterações no quadro sem atualizando as restrições. Então, só temos que voltar e fazer isso. Nós fizemos antes para resolver questões relacionadas. E vamos atualizar a restrição Constance para combinar com o quadro que acabamos de ajustar e vamos ver como isso parece agora. E aposto que parece um pouco melhor e o que tínhamos antes e, sim, acho que é bom o suficiente para trabalhar. Podemos ser capazes de ficar um pouco mais finos, mas não é o fim do mundo.
10. Como tirar uma célula de opinião de tabela de tarefas: Então agora temos nossa célula projetada, mas ainda precisamos substituí-lo completamente. I tabela ver célula no caminho auto índice estrada para usar a nossa tabela de tarefas de você vender. E então precisamos fazer isso agora. Então vamos voltar para o controlador de visualização de tabela Precisa fazer menos para ponta de seu controlador. E queremos voltar a si mesmo. Caminho do índice da estrada aqui. E assim de imediato. Sabe, se
você começar a digitar mesa de você vender, uh, você vai notar que o tipo é você. Isso não vai funcionar para usar a alfândega, que
criamos , que é a tabela de tarefas que você vende. Portanto, não é realmente uma questão do que podemos fazer aqui é, vez que a nossa célula de exibição de tabela de tarefas é uma tabela de vocês vendem, podemos simplesmente convertê-la como uma tabela de tarefas. Você vende, e nós faremos. Aqui está, já que isso vai ser um opcional Bem, basta fazer uma verificação. Então, se deixar ver tabela vender as pessoas nossa mesa de teste você mesmo, nós vamos fazer algo diferente. O que podemos fazer aqui é encontrar um bar. Uh, célula é igual a você ter uma mesa de si mesmo para que você possa começar com uma nova instância de uma célula . E se pudermos realmente eliminar ou então declaração aqui e se tivermos a nossa vista de tabela, vender aqui o tipo de célula, vai ser uma tabela de tarefas você mesmo. Então o que vamos fazer aqui é para o retorno tecnicamente,
vamos devolver o celular,
e então vamos dizer isso nós mesmos. Então o que vamos fazer aqui é para o retorno tecnicamente, vamos devolver o celular, Olhos são mesa, você vende, então vamos fazer isso missão lá. Vamos apagar isto aqui e agora. Estamos basicamente a dizer que vamos construir uma nova célula porque não podemos voltar até que a venda peça em troca um valor. Se somos capazes de pilotar, você é uma célula como uma mesa de tarefas de você. Então vá em frente e atribua a venda de volta aqui e devolva. Mas ainda há uma coisa que nos falta. Precisamos configurar a célula para que ele possa vincular o modelo de dados para a exibição real para realmente colocar os rótulos para o título da tarefa e a categoria da tarefa. Ainda não escrevemos nenhum código para fazer isso. Eso o que enfraquecer dio é se formos para a nossa mesa de tarefas de você vender. Não
implementamos nada aqui,
mas criaremos uma nova função. Não
implementamos nada aqui, Então telefone configurar com tarefa e os parâmetros vai na tarefa A, que é o modelo de dados. E precisamos ir em frente e criar outlets construtor de interface que nos permitem conectar nossos rótulos volta para a classe aqui para que possamos fazer as ligações quando recebermos um configure com a tarefa. Então vamos fazer aqui é abrir o editor assistente. Então eu pensei que abrir aqui e parece que eu tenho isso estendido muito longe de você para ver se eu poderia derrubar aquele pequeno servidor deslizante. E eu vou mostrar meu storyboard em uma das 10 dores aqui. E então, se entrarmos nessas células e expandirmos a exibição de conteúdo, podemos ver que temos esses dois rótulos o título e é intitulado Agora, uma vez que sub-classificada esta célula é a célula de exibição de tabela tarefa. Temos uma conexão direta de volta ao arquivo de código-fonte para que eu possa criar
saídas de construtor de interface de volta para o código. Então, eles mantêm pressionada a tecla Control e, em seguida, clicar e arrastar até a célula dentro da classe. E eu libero eu posso cozinhar uma nova conexão aqui do tipo de tomada. E desde que eu selecionei o primeiro rótulo, eu ia chamar este título de tarefa de rótulo e conectado. E também vou fazer a mesma coisa pelo título abaixo dele. Vou segurar
a tecla Control. Clique e arraste até aqui. Chamava-se “Esta tarefa”. Então título como esse e então vamos em frente. E quando temos uma tarefa para configurar a nossa célula de visualização de tabela, você pode simplesmente fazer o título da tarefa que o texto é igual a tarefa ao título. E então temos um pequeno problema aqui. Se você começar a digitar o ponto da tarefa, somente o título será exposto. E se te lembrares porquê, só
estamos a mostrar o título. Originalmente, quando usamos a mesa de si mesmo. Então, não é um problema que precisamos fazer é voltar aqui e expor algo mais de privado para
interno para que possamos acessá-lo fora da classe são a classe tarefa. Então, para fazer isso, simplesmente faça isso. Nós podemos apenas remover privada do tipo e apenas ter deixado assim seu interno, que é a quantidade de Maine interno. É realmente isso, um interno é os atores como o tipo de acesso Thea. No entanto, se você não especificar nada interno é o padrão, então privado é explícito. Interno é implícito, a menos que você o torne explícito digitando interno. Então, apenas algo para lembrar. Então, vamos voltar agora. Combinamos nossa tarefa. Subtitle Então tarefa subtítulo texto é igual ao ponto da tarefa E se você não pode ver o tipo, fazer o comando ser construir o projeto para que o piloto possa pegar a mudança. Acabamos de fazer o modificador de acesso e, em seguida, você deve ver o tipo aparecer aqui nesta lista . Hum, então imediatamente, nós vamos ter um pequeno problema aqui. O problema é porque não podemos fazer a atribuição porque o tipo de tarefa não é uma força. É literalmente no nome de uma tarefa, digite seu próprio tipo. Então, há algumas maneiras de contornar. Este provavelmente o mais fácil, vai ser apenas convertendo isso para sua string com o índio. Então, se você entrar em seu tipo de tarefa, o que podemos fazer aqui é dizer que isso vai ser uma corda e enfraquecer. Podemos fazer uma espécie de ah string valor legível para cada um desses casos para que possamos em vez de estudar todas as minúsculas, podemos dizer estudando assim, podemos fazer um valor padrão aqui para outro trabalho. Não, podemos fazer revestimento assim. Enfraquecer o planejamento de férias é assim. Então, é um pouco mais legível para humanos quando ligamos a qualquer tipo de elemento de vocês. Então, voltando aqui, um, que porque é um tipo de string agora que podemos fazer é combinamos com o Taif e combinamos com o valor bruto, que é a própria string. Você pode precisar fazer comando ser para construir um projeto aqui eso que ele compila com sucesso. Mas veja, uma vez que eu começar a digitar novamente após a compilação, eu tenho um valor bruto, que é uma string que aparece. Então, Então, o que nós provavelmente podemos fazer aqui é mudar porque nós não queremos indicar esse tipo apenas um pouco mais legível para que possamos fazer algo assim. Enfraquecer fita de
áudio, e então nós podemos injetar em nosso pequeno tipo de tarefa como esta tem fita, valor de
estoque Então ele vai executar isso no simulador, ele vai ver como ele é. Mas, na verdade, antes de fazermos isso, quase
esqueci. Nós realmente precisamos fazer a configuração aqui. Então, o passo final será próximo. Nosso editor assistente aqui, tabela vende figura de pensamento com tarefa, e ,
uh, essa tarefa vai ser algo que precisamos voltar para a fonte de dados. Então o que fazemos aqui é apenas deixar ah, vamos perguntar é igual a fonte de dados no caminho de índice dot ro. E se você se lembra, eu estava passando por isso antes, mas estou explicitamente recebendo a tarefa só para mostrar que você também pode fazer isso assim se quiser ser um pouco mais explícito, , e, em seguida, passar a tarefa como essa para fazer a configuração. Então, agora vamos executá-lo. E devemos ter todas as nossas ligações ligadas com a nova adição do nosso subtítulo ligado à nossa gravadora. E com certeza, você pode ver que estudar programação site codificação, fazendo trabalho de casa tipo lavanderia e planejamento viagem para Espanha de planejamento de férias tipo. Tudo parece estar funcionando
11. Como criar o controlador de visualização de do tarefa: agora, neste ponto do tutorial, nós definitivamente fizemos um monte de progresso em nossa lista de exibição de tabela. Mas o problema que temos agora é que só temos três itens que são basicamente codificados . Não temos como adicionar dinamicamente novas tarefas à nossa lista, e isso é algo que vamos corrigir nesta parte do tutorial eso. O que podemos fazer aqui é que temos uma barra de navegação. Podemos adicionar um botão de adição aqui no topo. E basicamente, quando clicamos nesse botão mais, ele vai carregar outro controlador de visão. Isso vai nos permitir inserir uma nova tarefa de lista para fazer no formulário, e então podemos salvá-lo e carregado diretamente em nossa lista de fazer automaticamente. E então o primeiro lugar para começar é de volta ao nosso storyboard. Então o que vamos fazer aqui é voltar e descer para a biblioteca de objetos aqui. Não é digitar item de botão de barra, e este é um tipo de botão que podemos adicionar a uma barra de navegação ou a uma barra de ferramentas, e podemos simplesmente arrastá-lo até aqui para o canto superior esquerdo do canto superior direito, e isso nos dará um bom botão que podemos usar de Aqui. E uma vez que temos o nosso botão selecionado, você vai notar que ele aparece sob o item de navegação, itens de botão da barra
direita e, em seguida, o item real aqui. Então, se formos para o inspetor de atributos, podemos alterar certos atributos para o nosso botão. Por exemplo. Talvez, em vez desse estilo de seleção personalizado, queiramos fazer um anúncio que mudasse esse ícone para um ícone de adição, o
que faz sentido para o que estamos tentando fazer. Também podemos mudar a tentativa do azul padrão para talvez algo que pareça mais adequado para o nosso tema, que é amarelo e preto. Então eu poderia fazer algo assim também. E uma vez que tenhamos feito isso, o que queremos fazer agora é conectar a ação do construtor de interface para quando este botão for tocado ou clicado. Então, se voltarmos e abrirmos o editor assistente e colocarmos o nosso storyboard de um lado e nosso para fazer lista tabela de controle do outro lado, podemos ir em frente e criar essa ação. Então, se entrarmos em nosso código aqui, você escolhe um lugar arbitrário e selecionamos nosso botão. Se mantivermos pressionada a tecla de controle, podemos clicar e, em seguida, arrastar para o nosso arquivo e do tipo de conexão da tomada. Vamos mudar isso para ação, e vamos chamar isso de criar,
ah, ah, nova tarefa tocada e conectá-la. E então, realmente, neste ponto é para onde vamos. Em vez disso, ela comeu o novo controlador de visão que precisamos criar apresentando-o totalmente. E uma vez que isso é apresentado, bem, insira uma nova tarefa no controlador de visualização salve-o e, em seguida, recarregue automaticamente. Naquele dia, aquela tarefa mu na nossa lista. Agora estamos prontos para criar nosso controlador de visão. Então volte para a biblioteca de objetos aqui. Vamos arrastar um novo controlador de visualização para a tela do storyboard, e este será o nosso controlador de visualização do criador de tarefas. Hum, o que eu vou fazer aqui é apenas o estilo amarelo e tipo do mesmo tema que temos seguido para o aplicativo. Você pode escolher a cor de fundo que você quiser usar, então eu vou deixar assim por agora. E o que eu preciso fazer a seguir é realmente criar o arquivo de código-fonte para este controlador de visualização e, da mesma forma, assim como fizemos com os outros dois começará criando um novo arquivo rápido. E vamos chamar esse controlador de visualização de criador de tarefas. Bem, então vá em frente e importe em seu kit, que contém o você tem classe controlador. E vamos definir nossa nova classe como criador de tarefas de classe. Poucos controladores de unidades cansadas de você. Eu visualizo controlador e substituirá a visão que carregar como o nosso ponto de entrada para este
controlador de visão eso. Depois que fizermos isso, , se você tiver seu editor assistente aberto aqui, podemos voltar e ligar se você tiver seu editor assistente aberto aqui,
podemos voltar e ligaro arquivo de código-fonte para que ele seja mapeado para o novo controlador e construtor de interface. Então, se nós selecionamos em sua visão, controlador, acabamos de criar nós vamos para o inspetor de classe aqui, podemos ir em frente e encontrar isso como um criador de tarefas de seu controlador e vamos apenas ir em frente. E também é que o storyboard i d e a idéia de restauração no caso de precisarmos fazer algo programaticamente mais tarde. E realmente, o que enfraquecer Dio é a partir daqui são novos mais botão. Podemos ir em frente e fazer uma opção presente do Mota Lee bem aqui para realmente ter certeza do controlador de visão do
criador de Newtown , uh, quando colocamos esse botão. Então vamos em frente e testar isso no simulador muito rápido e ver como isso se parece. E então meus simuladores abrem aqui e eu apertei meu botão mais e lá vamos nós. Então, meu controlador de visualização do criador de teste carrega. No entanto, neste
momento, não
temos como descartar isso porque não temos nenhum botão de retorno ou qualquer tipo de botão seguro. Então, essa é a próxima coisa que precisamos implementar é a interface de usuário para o controlador de
visualização do criador de tarefas .
12. Interface de usuário do criador de tarefas para o criador do controlador: Então, a próxima coisa que precisamos fazer é projetar a interface do usuário para um
controlador de visualização do criador de teste . Antes que pudéssemos fazer isso, precisamos tipo de ver quais elementos precisamos adicionar que são necessários para criar uma tarefa. Então, se voltarmos para a tarefa dot swift em nossa pasta de modelos e olharmos para nossa
classe de tarefas , podemos ver que adicionamos três coisas. Temos um título, temos uma data de vencimento e quando temos um tipo de tarefa. Então vamos começar com o mais fácil que será o título. E o que podemos fazer por isso é arrastado sobre um campo de texto. Então, se você descer até o storyboard e no canto inferior aqui para a biblioteca de objetos, se você digitar no campo de texto, arraste sobre um campo de texto para o storyboard, e este será o nosso campo de entrada para o nosso título de tarefa, Então o que podemos fazer aqui é começar a posicionar este, hum, onde queríamos ir. Eu só vou conseguir isso aqui por agora. E a próxima coisa vai fazer é voltar e ligar a tomada do construtor de interface para o nosso campo de
texto aqui no nosso controlador de visão. Então volte para o criador de tarefas de seu controlador e logo acima você carregou o que Weaken Dio é criar essa conexão. Então, mantendo pressionada a tecla control, podemos clicar e arrastar para o controlador de exibição, e nós apenas chamar este campo de texto título tarefa. Em seguida, vamos em frente e adicionar mais dois campos de texto, então vamos em frente e arrastar em mais dois. Então dragão Um aqui e outro aqui e estava indo arrastá-los para fora. Então eles são todos iguais com fazer o mesmo novamente para o 3º 1 E a próxima coisa que precisamos é um botão para realmente invocar o processo para criar uma tarefa. Então, se começarmos a digitar para o botão, vamos arrastar o botão real que vem aqui não o botão da barra, mas o item, mas apenas um botão. Então nós arrastamos isso para o storyboard, e nós podemos fazer aqui é em vez do botão de texto. Podemos ir ao inspetor de atributos e digitar, criar tarefa,
e você pode arrastar o ah dentro da altura para obter um botão maior lá,
e eu vou mudar a cor do meu texto para preto. criar tarefa, e você pode arrastar o ah dentro da altura para obter um botão maior lá, Eu poderia ficar com o tema do nosso aplicativo. E eu também vou mudar essa fonte de texto aqui de costume, eu acho que eu vou tentar algo diferente. Hum, então Helvetica novo é o tipo lá, mas eu vou ver sobre Ah, mas eu instalei aqui Traven e então vamos fazer Ah, talvez um pensamento ousado aqui. Fonte mais pesada, se pudermos. Bem, é maior e só para esse tamanho de fonte maior, arraste um pouco mais. Então agora temos a maioria dos nossos controles de entrada criados. A próxima coisa que podemos adicionar para tipo de dar isso de vocês controle um pouco mais polido é um nome como basicamente um título de uma maneira de sair dele. Porque não temos como descartar este controlador de visão agora. Então provavelmente a maneira mais fácil aqui seria adicionar uma barra de navegação. E agora você vai notar aqui. Quando comecei a ter uma navegação, você verá o controlador de navegação e a barra de navegação. A principal diferença é se você se lembrar nos tutoriais anteriores, é o controlador de navegação é uma forma especial de um controlador de visão que fornece a barra de navegação. No entanto, este é um controlador de visão que estamos apresentando Motive Lee. Nós não estamos e tinha sido apostando isso em um controlador de navegação per se. Então, quando nós realmente negociamos um Segway móvel como fizemos aqui, que tem o botão mais que leva o Segway todo o caminho para ouvir você lembrar que ele vem de baixo. Ele não é empurrado para a pilha da maneira que qualquer outro controlador de visualização dentro de um
controlador de navegação é feito. Mas ainda podemos simular o mesmo tipo de olhar com a barra de navegação. Então, se nós apenas dragão barra de navegação em nosso controlador de visão, o que nós podemos fazer aqui é, ah, começar a criar algo que tipo de ainda parece semelhante. Mas ele se comporta em uma apresentação móvel. Então, com a barra de navegação arrastada até aqui no topo, bem, nós podemos. Em seguida, fazer é adicionar em um botão para descartar isso. Então, se começarmos a digitar o botão e com erros ortográficos, mas em seus deveres, vamos arrastar sobre uma barra mas um item para o lado esquerdo desta barra de navegação e o que podemos fazer aqui é se você selecionar sua barra de navegação e você passar por cima e abrir essa barra de navegação pequeno menu lateral na parte inferior aqui, se você realmente dar uma olhada na hierarquia de exibição para o controle Barra de navegação tem um título, uma barra esquerda, mas um item aqui com um item real dentro dele. Então, isso é realmente este item, e ele tem a capacidade de também adicionar uma barra direita. Mas à noite, , se arrastássemos outro item aqui, poderíamos criar outro botão. Mas nós realmente não precisamos de um para este. Só precisamos de uma maneira de sair dessa, descartando-a. Então o esquerdo aqui é bom o suficiente por enquanto. Então o que podemos fazer é começar mudando o título. Se você selecionar o título aqui e você vai para o inspetor de atributos, ele tem um texto padrão definir o título para que possamos simplesmente chamar esta nova tarefa ou criar nova tarefa. Vamos ver como fica. Então isso parece OK. Hum e, em seguida, se queremos também alterar o texto para o botão real, se vamos para baixo para itens Barbara esquerda e, em seguida, selecionar o item real, que é o botão. Podemos ir aqui e alterar alguns dos atributos no inspetor de atributos, então você verá aqui. Ele pré-carrega com o texto do item sob o título. Podemos alterar o texto muito perto, por exemplo, e você verá que ele o atualiza bem aqui. Outra coisa que podemos fazer é mudar a tenda. Há azul é as tendas padrão, mas se queremos manter o nosso tema e mudá-lo para a cor do texto preto que funciona para, há algumas outras opções aqui. Eu acredito que há uma opção feita, que estes são apenas alguns dos padrões que a Apple fornece. , Cancele, desfaça. Salve alguns destes que você pode usar fora da caixa, se quiser. Eu vou desfazer isso só porque eu quero usar perto também há diferentes estilos que você pode usar fronteira versus avião. Uh, eles realmente não mostram muita mudança visual no storyboard, mas há apenas algumas opções diferentes aqui que você pode mudar, então e agora que temos a maior parte do nosso formulário preenchido, precisamos começar a obter tudo na posição adequada. Especificamente, queremos tentar manter esses elementos de controle fixo alguém no centro do da forma, mas precisamos fazê-lo um pouco mais elegantemente. A razão pela qual precisamos nos preocupar com nosso layout é se você selecionar seu controlador de visualização e você descer até a parte inferior aqui onde ele diz vista como e você começar a escolher diferentes
tamanhos de dispositivo . Por exemplo, estou no iPhone 8. Mas se eu cliquei em, vamos apenas dizer que o iPhone S c e você voltar, você pode ver que agora todos os meus elementos não estão centrados. A mesma coisa aqui. Se eu descer para os quatro s, parece ainda pior se eu subir para o iPhone 10 aqui. Também parece um pouco ruim. Hum, e no iPad, será realmente esse eso Esse é o tipo de nosso problema que queremos resolver é como construir uma interface que parece muito boa em todos os tamanhos de nossos dispositivos, e é aí que o layout automático entra. E especificamente podemos usar o que é chamado de pilha de você, que gerencia muito do empilhamento vertical ou horizontal de elementos que são dispostos de forma semelhante. Tipo assim, e isso nos permite não ter que implementar as restrições. Suman meticulosamente um construtor de interfaces. Ele tipo de gerencia alguns do layout automático para nós ou torna um pouco mais fácil em DSO. Isso é o que vamos fazer a seguir é criar nossa exibição de pilha para basicamente encapsular esses elementos e posicioná-los verticalmente. Foi honestamente centrá-los neste controlador de vista. Então o que precisamos fazer é selecionar todos os nossos elementos de controle ao mesmo tempo. Uma coisa que você pode fazer é arrastar uma caixa ao redor deles assim, ou você pode puxar para baixo a tecla shift e clicar em cada um individualmente com a tecla de navios pressionada . E é como todos eles ao mesmo tempo e o que precisamos fazer. Antes de termos a exibição de pilha, como queremos dizer que queremos usar para ser o mesmo com no alto que eles estão
agora , nós não queremos que eles mudem, então podemos fazer aqui é ir para baixo para este botão e adicionar em um com a restrição antecipada, que o adiciona para cada controle que selecionou neste grupo. Agora você percebe que tudo está em vermelho aqui porque temos basicamente restrições configuradas que não são informações suficientes para o layout automático saber onde posicionar essas coisas. Então é por isso que ele está nos dando erros ou erros de restrição. Isso é bom. Vamos consertar isso à medida que avançarmos. Então agora que estão dentro da altura para cada um é fixo. Podemos incorporá-los em uma exibição de pilha pressionando este botão aqui, e você vai notar que eles estão todos juntos. Não há mais espaçamento vertical entre eles e ah, com e a altura ainda permanece inalterada, que é o que queremos. Então agora eu posso arrastar a pilha para você. E se você olhar aqui dentro do controlador de exibição do criador de tarefas, eles expandem a hierarquia de exibição. Você pode ver que ao descer, você tem sua barra de navegação e eu entendo você. E se você expandi-lo, você vê, todos os nossos elementos são adicionados no interior dele. Então, o que? Podemos fazê-lo aqui,
Então, na verdade, selecione nossa pilha para você e tipo de posição no centro aqui e o que
podemos então fazer é ir até o inspetor de atributos aqui e começar a olhar para algumas das
propriedades para a nossa exibição de pilha, e você pode ver que há um eixo que é automaticamente colocado na vertical porque é detectado que há um alinhamento. E podemos aumentar o espaçamento vertical pressionando este botão de espaçamento para cima ou para baixo para criar um espaço vertical entre seus elementos. Igualmente onde você sabe que pode alterar as opções de distribuição e alinhamento a partir desses dropdowns aqui. Mas você vai notar aqui que ainda há um monte de ah vermelho em nossos, hum, guias de
restrição, e você verá que estamos perdendo restrições para algumas coisas diferentes. Exposição de por que a posição é desconhecida para todos os campos de texto do título da tarefa porque,
na realidade, as únicas restrições que eles têm sobre eles ou as dentro da altura que adicionamos. Ainda não adicionamos nenhuma restrição à nossa pilha, então é isso que precisamos fazer agora. E a maneira mais fácil de censurarmos tudo aqui é
centralizar horizontalmente e verticalmente a pilha nova. Então, se você selecionar sua exibição de pilha a partir daqui, que destaca aqui e você vai até este botão aqui para Alinhar. O que vamos fazer é selecionar o horizontalmente no recipiente e verticalmente no recipiente e adicionar essas restrições e você verá aqui que ele tipo de posições Aqueles move-lo um
pouco para cima eo que podemos fazer aqui é tentar arrastar isso para fora. Então esse é o verdadeiro centro desta tela aqui. E parece que eu tenho um pouco de espaço vertical demais entre o meu elemento. Então eu vou diminuir isso um pouco mais no inspetor de atributos aqui, tentar deixar esse olhar um pouco mais limpo. Sabe, eu penso em vinte e vinte anos. Deve ser bom. Hum, então vamos apenas, você sabe, ter
certeza que isso é bom e central lá, e vamos ver aqui se temos mais de avisos diretos S O. Isso é apenas dizer que o fixo com restrições em o botão pode causar problemas de recorte . Eso podemos mudar isso aqui ou pode ser desnecessário para que possamos remover essa restrição em apenas porque você percebe aqui que o botão é agora exatamente o com do texto nele com apenas a restrição de altura aqui, Hum, e se olharmos para trás, para os nossos avisos, todos
desapareceram. Então, temos resultado de todos os nossos problemas de restrição de layout automático que tivemos também a Precisamos
corrigir a barra de navegação para a parte superior do controlador de visão porque não há restrições adicionadas a ele. Assim como a barra de navegação aqui na hierarquia Este é um pouco mais fácil que
podemos fazer é descer para,
uh, uh, o botão de restrições aqui para novas restrições. E vamos apenas fixar este no topo, à esquerda ou à esquerda no lado direito ou nas bordas finais e adicionar as
restrições de histórico ali e isso irá bloquear isso no lugar. Então, agora, se começarmos a visualizá-lo em diferentes tamanhos de dispositivo, você pode ver que se eu selecionar o iPhone para nós, pareceremos OK. Se olharmos para o iPhone S e parece OK, e vamos apenas verificar as coisas no iPhone. 10 estão parecendo bem aqui, também. Parece OK. Vamos procurar o oito. Vamos até dar uma olhada esta noite, e para ver como isso seria colocado no iPad. E então tudo centrado e isso é exatamente o que queremos
13. Como configurar as IBOutlets e IBActions para o controlador de visualização do programa de tarefa: agora que temos tudo colocado em posicionado, queremos ir em frente e começar a conectar, são você elementos e está implementando a demissão real deste controlador de visão quando o botão
fechar é tocado. Então, o que podemos fazer é passar para a tarefa de seu controlador aqui, e vamos manter tudo lado a lado com storyboard de um lado e o código do outro, e vamos começar a conectar nossos controles. Então, se entrarmos no controlador aqui, nesta pilha, que os criadores de tarefas de você controlador, vamos começar com o botão Fechar para que possamos ir em frente e ter isso selecionado aqui. E podemos criar isso. Eu ser ação adicionando a tecla Control pressionada e, em seguida, clicando e arrastando sobre. E eu vou colocar o meu bem sob carga vista. Mas a partir da tomada mudará o tipo para a conexão à ação. E vamos chamar esse botão de fechar tocando. E enquanto estamos nisso, vamos em frente e começar a adicionar os outros, também. Começaremos com o campo de texto do título, então faremos a mesma coisa. Wilken mantenha pressionada a tecla Control e, em seguida, arraste e crie uma conexão para, um campo de texto título. Faremos a mesma coisa para todos abaixo do campo de texto do tipo de tarefa e para o texto final. Campo também fará a mesma abordagem campo de texto data de vencimento,
e, em seguida, finalmente irá criar a ação adicional aqui para criar a tarefa tão bem. Controle, tecla e segurando, clique e arraste. E como este é um botão, vamos mudar o tipo de conexão de tomada para ação, e vamos chamar isso de criar tarefa mantida agora, medida em que implementar o código aqui, provavelmente a peça mais fácil de implementar. Apenas contestamos que tudo está funcionando é o botão de fechamento real sendo tocado em si. Eso O que podemos fazer aqui é quando o botão fechar é tocado para realmente fechar fora do controlador de
visão ou para descartá-la. É simplesmente uma linha de código chamada “Dispensar”. Então, no botão fechar toque método Will irá digitar em Smith e você verá aqui que a descrição diz descarta o controlador de visão que foi apresentado Motor Lee pelo
controlador View . Então, o que teria apresentado isso era a sua lista de fazer exibição de tabela Controller no bat
vai ser demitido uma vez que tocar neste botão aqui. Então tudo definido animado verdadeiro. E há um manipulador de conclusão para quando dispensar é feito que basicamente é uma chamada volta dizendo que ele está completado que o seu míssil. Mas não vamos fazer nada lá para que possamos passar nulo, já que esse é um parâmetro opcional. E agora vamos em frente e realmente executar isso no simulador e ver como ele se parece. Vou mudar para o meu iPhone no mar e começar isso aqui e vamos ver o que
temos . Então meus simuladores abrem agora, e eu vou seguir em frente e apertar o botão de mais para criar uma nova tarefa. E você pode ver aqui que meu
menu aparece e, ah , , se eu tiver minhas roupas, mas aqui descarta o controle de visão voltando para cima, hum, ele volta logo. Então, agora que podemos descartar são apresentados controlador de exibição de criador de tarefas, a próxima coisa que vamos querer fazer é começar a configurar os campos de texto. Eso começando com o campo de texto do título. Queremos ter certeza de que, quando realmente clicarmos ou tocar no campo de texto, podemos trazer o teclado simulado ou o teclado de software e, em seguida, ser capaz de digitar
alguns textos,
pressione a tecla de retorno e,em alguns textos,
pressione a tecla de retorno e, seguida, com sucesso
descartou o teclado eso para começar com isso,
O que vamos fazer aqui é dentro de uma tarefa Creator view controller irá criar uma nova função
aqui em baixo e vamos chamar este funk privado configurar campos de texto. E quando a carga visualizada é chamada bem,
na verdade, chame esse método para começar a configurar nossos campos de texto. E o que vamos ter que fazer aqui é configurar o delegado do campo de texto. Então, se você se lembra do controlador de vista de tabela, uh, para o nosso controle de exibição de tabela lista, vamos voltar e dar uma olhada rápida em algo lá dentro. Vamos entrar, revisitar o conceito de delegados e delegação. Onda realmente implementa manualmente um delegado em apenas um momento aqui. Então, se voltarmos aqui e clicarmos no controlador de visualização de tabela U I, você vai se lembrar que tivemos au I tabela view delegate. Agora não precisamos fazer nada porque o controlador de exibição de tabela implementa
isso automaticamente para nós. Mas é um protocolo, e da mesma forma, se você clicar em um comando clicando em você, I campo de texto e saltar para a definição aqui. Também tem um delegado. Então, se procurarmos delegado, há um delegado de campo de texto você I. E se olharmos para o que está definido neste protocolo, ele tem todos os métodos que serão chamados de notificados para quando coisas diferentes com o campo de texto aconteceram, como quando a edição começa, o edição termina, a tecla de retorno foi pressionada, e isso nos dá todos os pontos de disparo para fazer certas coisas que precisamos fazer com nosso teclado e descartá-lo e o que não? Hum e assim como nós realmente ir em frente e implementar o delegado é bem simples. Vamos fazer é voltar para o nosso criador de tarefas de seu controlador aqui e dentro do nosso método de configuração de campos de
texto. Vamos começar com o campo de texto título, e ele tem a propriedade delegate ponto e vai dizer que o delegado para este campo de texto
vai ser igual a auto e auto significa simplesmente controlador de visão criador tarefa. Essa é a turma que estava lá dentro. Então, o que estamos realmente dizendo é que nosso controlador de exibição de criador de teste será o delegado para qualquer coisa para os campos de texto U I nesta classe. Então, sempre que as coisas mudam, uh, interações de campo de
texto ocorrem essas tarefas ou notificações ou,
um,os um, chamada serão reencaminhados para o controlador de exibição do criador de tarefas que é o ator delegar. E assim a maneira irá realmente implementar os métodos aqui, porque você pode ver que eu
já estou recebendo um erro que diz que eu não posso atribuir este valor ainda é porque o controlador de
visão criador tarefa tem que estar em conformidade com o protocolo. Você eu delego textual. E então o que podemos fazer é criar uma extensão no controlador de visão do criador de tarefas que esteja em conformidade com o protocolo. Você eu delegar campo texto e assume que eu faço isso. Você vai ver que esse erro vai desaparecer agora. Por que eu fiz isso na extensão? Bem, eu poderia facilmente ter feito isso aqui em cima. Eu poderia ter feito você eu delegar texto, mas tem boa prática, especialmente para rápida. É muito comum envolver seu protocolo, conformidade ou implementações dentro de uma extensão no que você está trabalhando para tipo
de manter as responsabilidades separadas para que eu possa lidar com todos os
métodos de delegação de campo de texto U I dentro desta extensão. Isso é separado de toda a corelogic acontecendo aqui no controlador de visão, tipo de mantê-los isolados e apenas mantendo as coisas modulares. E você sabe, esta separação de preocupações é apenas uma boa prática para uma programação
rápida
e rápida, e eu menos então agora temos que descobrir quais métodos aqui precisamos implementar? Porque novamente, se voltarmos e dermos uma olhada no delegado do campo de texto, praticamente tudo aqui é opcional. O que significa que não temos de implementar estas fraquezas apenas de acordo com o protocolo como eu fiz e não fazer nada se quisermos. Mas mesmo que isso seja inútil, temos a opção de implementar qualquer um desses ou nenhum deles, dependendo do que estamos tentando fazer. Então, o óbvio que precisamos absolutamente é campo de texto deve retornar, e vamos retornar verdadeiro aqui e analisar o que esse método faz e por que precisamos dele no DSO. O que está acontecendo aqui é que a senhorita até colocou a documentação selecionando este método, e se eu passar para o lado direito aqui, às vezes ele não mostra imediatamente e código ex. Mas veja se posso pular para a definição disso aqui, , veja aqui pular Teoh. Então ele diz que ele é chamado quando a tecla de retorno é pressionada. Retorne não para ignorá-lo, e ele fornece o campo de texto com o qual foi interagido. Então, se eu clicasse no campo de texto do título e apertasse a tecla de retorno, esse campo de texto tecnicamente seria o campo de texto do título. A mesma coisa para a data de vencimento. A mesma coisa para o campo de texto do tipo de tarefa. E então, se eu quiser descartar esse teclado, tudo o que eu vou fazer é dizer sobre este campo de texto fornecido a partir deste método delegado. Resignar o primeiro socorrista, e isso é basicamente dizer que renunciar o elemento que está em foco agora e
rejeitá-lo , que naquele momento seria o teclado. E a documentação provavelmente pode explicar melhor do que eu, onde diz que notifica esse objeto que foi solicitado a renunciar ao seu status como primeiro socorrista em sua janela no DSO. Agora, se formos em frente e executarmos isso em um simulador, vamos ver como isso vai parecer. Então meus simuladores abrem aqui eu vou entrar no controlador de visualização do criador de tarefas, e eu preciso ter certeza de que meu teclado está ligado aqui porque, hum, ok, parece que é. Mas agora se eu pressionar a tecla Return, ver como ela está descartando? Então eu clico no teclado vem para cima tecla de retorno para fazer negócios. Agora, se eu tentar a mesma coisa para os outros dois campos de texto, veja, não
é que não está descartando. A razão pela qual não é demitida é que eu só tinha projetado o delegado para este, o
que significa que a chamada para rejeitar o retorno dela é basicamente demitido. O teclado não será acionado para os outros dois campos de texto até que eu também atribui o delegado da mesma forma que eu fiz o campo de texto título. E isso é algo que ainda precisamos fazer aqui em outra coisa, também. Se você não vir no simulador seu teclado chegando porque esta é uma configuração, você tem que ligar indo para o hardware, procurar teclado e certificar-se de que você tinha teclado de software de alternância como o meu estava funcionando, mas deve tem sido ah, vamos voltar lá e ter certeza que, hum certo, Ok, você vai em frente e disse que para ter certeza de que você pode alternar. Agora vamos em frente e fazer a mesma coisa para os outros dois campos de texto e atribuir seus delegados para que possamos voltar para o método configure aqui e ir data de vencimento. delegado do campo de texto é igual ao campo de texto do tipo de tarefa e não delegar é igual a si mesmo. Agora vamos correr no simulador mais uma vez e ver se podemos descartar os teclados para todos esses três campos de texto agora. Então, indo para o criar novo controlador de exibição de tarefas, se eu descer para o outro campo de texto aqui e pressionar a tecla de retorno, você pode ver que ele descarta. É não. Se eu descer aqui na 3ª 1 apertar a tecla Return, você pode ver que ele descarta também. Então todo esse ar agora está funcionando corretamente devido a ligar os delegados para cada um
deles . Agora vamos dar uma olhada em alguns dos atributos de um você um campo de texto, então volte para o criador de tarefas de seu controlador e selecione um dos seus campos de texto e vá para o inspetor absoluto aqui. E vamos dar uma olhada em algumas das propriedades que temos disponíveis. Então, além de texto, cor e fonte, também
podemos mudar, como a posição do texto alinhado à esquerda centro Landry o leão justificado. Então, provavelmente queremos que nosso texto seja centralizado só porque visualmente vai parecer mais atraente. Hum, e há também esta opção aqui para texto de espaço reservado. Agora, texto de
espaço reservado é basicamente um prompt para morreu o usuário para deixá-los saber que tipo de texto ou que informação deve estar colocando no campo. Então ah, bom exemplo de espaço reservado aqui seria Enter Task title e geralmente isso usado para mostrar construtor de
interface aberta . Não sei por que não é mais. Ah, vamos vê-lo quando executá-lo. Mas isso também costumava aparecer aqui também de volta nas versões mais antigas do X bom, hum e ah, vamos ouvir voltar ao 1º 1 aqui. Você também pode alterar o estilo da borda se quiser, então você tem um tipo de borda clara de uma borda retangular com um contorno preto, borda
embutida. Esse tipo de parece estar rebaixado para dentro, e então o padrão, que é o arredondado que já usamos. Há muitas outras propriedades aqui também. Outro interessante é o tipo de teclado, os teclados padrão. O que você viu, onde tínhamos letras e números. Mas você também pode alterá-lo para ser apenas um teclado numérico ou um teclado de telefone. É assim que você pode configurá-lo de dentro da interface Builder. Aqui está muita coisa. Muitas opções, especialmente a tecla de retorno. Você pode alterar a tecla de retorno para outra coisa que é feito ou próximo, ou qualquer uma dessas opções disponíveis em vez de apenas retornado. E há também um teclado. Olha, há um escuro, um leve. Então, Então, vamos tentar. Vamos mudar o nosso. Muito escuro só para ver como é. Hum, também dois. Nós provavelmente queremos definir os outros dois campos de texto para ter o mesmo tipo de estilo tão ameaçador que o teclado parece muito escuro para o, hum, meio e teclado. Procure escuro para o 3º 1 Também para ter um anúncio, o texto de espaço reservado para este. Então eu acho que provavelmente vamos tipo de tarefa dio aqui. Então, para o espaço reservado texto vai fazer inserir fita de tarefas e para o 3º 1 aqui vai fazer Enter data de vencimento da
tarefa E agora vamos em frente e executar isso no simulador e ver como ele
se parece . Então os simuladores abrem aqui e, ah, eu tenho o meu título de tarefa aqui e isso é o que o escuro ah, teclado. E parece que esqueci de centralizar o texto no segundo e no terceiro 1, mas não se preocupe. Enfraquecer. Faça isso bem rápido. Você percebe aqui que é o teclado temático escuro, e você verá aqui o texto do espaço reservado. E à medida que começo a inserir texto como uma nova tarefa, o texto do espaço reservado desaparece. Se eu remover meu texto, o texto do espaço reservado volta. Uh, e eu vou apenas consertar meus outros. Você texto campos muito rápido por dis digitando seu alinhamento. E agora que se parecem com o 1º 1
14. Introduzir o UIPickerView: Então agora precisamos terminar de reunir a entrada do usuário de nossos campos de texto e, em seguida, criar uma nova tarefa em descartar o controlador de exibição e para selecionar itens de uma lista. IOS realmente não tem o conceito de um menu suspenso como você provavelmente já viu no Web APS ou até mesmo um aplicativo Android. O que temos em vez disso é o modo de exibição do seletor I, e isso permite que um usuário faça uma seleção em uma lista de ervas de rolagem em vez de ter que inserir dados do zero como eles fariam. Qualquer campo de texto branco e o campo de texto de data de vencimento neste campo de texto de tipo de casa vão
precisar de você. Eu escolho comentários para seleção, então vamos dar uma olhada no campo de texto U I. Em mais profundidade, vá em frente e comanda. Clique no campo de texto para ir para a definição e procurar a exibição de entrada na classe de
campo de texto U I. E essa será a exibição apresentada quando o campo de texto for tocado ou
entrar em foco na cadeia de respondentes. E essencialmente, ele vai trazer uma visão de selecionador U I que vamos configurar com nossos tipos de tarefas ou datas de
vencimento. E, em seguida, uma vez que um usuário faz uma seleção, irá lembrar o que eles selecionaram. E esses serão os dados que vão para a criação da nova tarefa. Então, vamos voltar ao nosso controlador de visualização para o criador de tarefas e começar a
configurar essa configuração . Então a primeira coisa que vamos fazer é começar criando uma nova propriedade, e vamos chamar este bar privado data de vencimento ou uma imagem de tipo de tarefas sua. Vai ser um tipo que você eu selecionador vista. Vamos em frente e declarar isso opcional porque precisamos configurá-lo primeiro. Então o que vamos fazer aqui é dentro dos métodos de campo de texto configurar, uh, estão em para seus campos de texto. Não que vamos em frente e configurar isso para que vamos fazer o seletor de tipo de tarefa View é igual a você. Tenho uma foto sua para criar uma nova instância e o que faremos a seguir. Uma vez que vamos começar com o tipo de tarefa, o campo de texto de tipo de tarefa na frente de você vai igualar a exibição do seletor de tipo de tarefa. E agora vamos ah comandos Clique em você. Eu escolho, revisto e acerto salto para definição e dar uma olhada nesta classe e ver o que é. Então imediatamente podemos ver aqui olhando para a cadeia de herança que você eu escolher revisão deriva de um u eu ver. E essa é a razão pela qual fomos capazes de atribuí-la como a contribuição de vocês porque, em última análise, ele herda todos vocês. Eu usei propriedades e na cadeia de herança aqui. Agora, para o eu escolher revisão em si, ele tem seus próprios componentes e personalizações aqui e realmente duas coisas importantes para tomar nota de nosso delegado na fonte de dados. É como fizemos com o delegado do campo de texto da UI. Vamos implementar o delegado na fonte de dados manualmente em nosso
controlador de visualização de criador de tarefas eso Vamos começar a trabalhar nisso agora. Hum, então nós já fomos em frente e atribuímos a exibição de entrada aqui, mas a próxima coisa que precisamos fazer é configurar o delegado na fonte de dados. Então o que vamos fazer é um campo de texto de tipo de tarefa. Eu sinto muito. Exibição do seletor do tipo de tarefa Iniciar delegar igual self e tipo de tarefa selecionador exibir fonte de dados Igual , self, e vamos obter um ar de compilação muito rapidamente aqui porque não temos conformado criador de
tarefas de você controlador para esses protocolos em, assim como fizemos aqui no delegado de campo U. S. S.
X. Vamos fazer exatamente a mesma coisa para a exibição do seletor, então vamos em frente e criar outra extensão aqui. Extensão no Criador da tarefa. Você pode assumir que vai estar em conformidade com duas coisas vai estar em conformidade com a fonte de dados de visualização do selecionador U I protocolos de delegado e, ah, o obrigatório que temos que implementar é a fonte de dados. E então vamos em frente e comanda. Clique nele, pule a definição e veja o que precisamos fazer neste neste. Veja aqui você eu selecionador ver fonte de dados Às vezes código X, uh, quebra quando você comandos clicar em coisas. Então, e encontrou o protocolo aqui, e as duas coisas que temos que implementar que não são opcionais são o número de linhas e o componente e o número de componentes. E isso é bem básico, certo? Uh, mesmo aqui, se você não tem certeza do que é um componente,
é basicamente uma coluna de dados escaláveis, e veremos muito rapidamente assim que tivermos isso ligado para que possamos começar com isso agora mesmo . Então vamos começar a digitar o número de linhas componente, e vamos apenas retornar zero para o momento e um número de componentes, que por agora nós estamos apenas indo para transformar um agora, até agora, tão bom Isso vai nos levar além do erro de compilação que teríamos tido aqui. Mas ainda precisamos ir em frente e realmente construir o array ou a fonte de dados que
vai ser alimentado para alimentado basicamente nesta foto de você. E então, se voltarmos aqui, , já que esses são todos tipos de tarefas, o que podemos fazer é criar uma matriz privada. Então privado, vamos tipos de tarefas, você sabe, nós só temos esses tipos sendo string realmente sabe o que vamos fazer. Tipo de tarefa? Bem, comprando o valor da string. Hum, e isso vai ser igual tarefa ou ponto codificação Tenho férias planejamento ponto estudando naquela casa trabalho para todos os diferentes tipos de tarefas que apoiamos. E então agora esta vai ser a nossa fonte de dados que contém quatro itens onde as quatro tarefas
diferentes disponíveis para nós e é que vamos fazer aqui é voltar para baixo para o número de linhas e vamos retornar a fonte de dados ou as fitas de tipo de tarefa que Contar. E assim de imediato aqui que está dizendo que devemos ter quatro itens são imagem de você porque há quatro itens na própria fonte de dados. Agora que as fontes de dados se conectaram, vamos realmente explorar o você. Eu imagino você delegar e ver o que tem aqui. Então, se nós comando clique nele e pulou uma definição quando procuramos por você, eu escolhi seu delegado vista. Podemos encontrar o protocolo aqui, e vamos notar que um monte de coisas aqui tipo de relacionadas com o poderia a
configuração visual do controle como o com para um componente, a altura da linha para o componente, o título para a linha, uh, a vista para a linha. E então se você realmente fez uma seleção em uma fileira, todos esses ar disponíveis aqui. Então, os que vamos precisar da nossa linha selecionada e título para a estrada. Vamos implementar esses métodos agora mesmo. Então vamos voltar para o nosso controlador de visão aqui e começar a trabalhar no para que nós lidamos com esta partícula. Agora estamos prestes a começar a lidar com este protocolo. Então, se você começar a digitar título para linha, você vai obter de volta o título para o método componente estrada. Aqui, Noser retorna uma força opcional. Além disso, se você começar a digitar, selecionou, você vai voltar. Ele selecionou linha e Componente, e nós também vamos implementar isso. Então sabemos quando uma seleção foi feita e obter o item selecionado do usuário. Então o que precisamos fazer aqui é o que nos é dado? Foi-lhe dada uma foto de você foi dada a linha real e recebeu o componente real, que no nosso caso, há apenas um componente para agora. Então, realmente, tudo o que precisamos é da linha para descobrir o que eles selecionaram. Então, podemos dizer que deixe a tarefa selecionada é igual aos tipos de tarefa na linha selecionada. E depois o quê? Enfraquecer Dio é retornar Tarefa selecionada e eu soletrou que errado. Corrigir que a tarefa selecionada retornar o valor bruto do ponto da tarefa selecionado ou o valor de seqüência de R E newme para a tarefa. E agora nós temos tudo ligado para realmente ver como isso vai ser. Vamos em frente e executar isso no simulador e dar uma olhada rápida no que temos até agora. Então, de volta no controlador de exibição do criador de tarefas aqui. Se eu ir em frente e selecionar o tipo de tarefa clicando nele, você verá Aqui está uma foto sua. Então agora temos as tarefas selecionáveis reais que podemos percorrer, como tarefas domésticas, estudos, planejamento de
férias e codificação. E, no entanto, não
há como descartar isso agora. Nossa caminhonete. Ele está meio preso porque se você se lembrar com os campos de texto, poderíamos simplesmente apertar a tecla de retorno para descartá-los com nossa escolha de você. Pelo menos no momento, não
temos nenhuma maneira de sair disso porque ele não está jogando pelas mesmas regras que o delegado de campo de
texto estava fazendo no campo de texto deve retornar método aqui, mas não se preocupe. Há duas maneiras de lidar com isso facilmente. E se voltarmos ao método de estrada selecionado aqui, uma coisa que podemos dizer é que uma vez que eles fizeram uma seleção, podemos ir em frente e descartar essa foto de você. Mas você pode estar se perguntando como faríamos isso na vista? Há uma vista, não terminar o método de edição. E se formos em frente e dar uma olhada na documentação para isso por comando clicando e pulando para definição, ele é usado para fazer a exibição ou qualquer sub view que é o primeiro respondente resignado. E isso é importante porque sempre que esses campos de texto mostram seu teclado onde eles mostram suas exibições de entrada como a exibição do seletor está fazendo, esse é um primeiro elemento de resposta, e ele está respondendo. É a primeira coisa a responder à entrada do usuário na cadeia dos primeiros socorristas, basicamente, e forçando-o a terminar ou chamando visualizado e editando definido como true, ele vai automaticamente descartá-lo, não importa qual é o tipo aberto nesse ponto. E vamos ver se há mesmo Sim, ok, então a partir da opção rápida aqui, há ainda mais alguma documentação. Esse método examina a exibição atual e seu abuso de alguma hierarquia de exibição para o
campo de texto que é atualmente o primeiro respondente. Se ele encontrar um, ele pede que esse campo de texto renuncie ao seu primeiro respondente, e se o perímetro de força definido como verdadeiro, o campo de texto nunca é solicitado, é forçado a renunciar. Então, agora, se executarmos isso e antes de executar, ele fará 11 outra coisa aqui é irá vincular o tipo selecionado para o campo de texto do tipo de tarefa. Então, o que podemos fazer aqui dizer tipo de tarefa texto campo ponto propriedade de texto é igual ao selecionado ou os tipos de tarefa para a linha. E nós vamos vincular o valor de roubo, que é essa força para a propriedade de texto real aqui. E então vamos rodar isso agora no simulador e dar uma olhada rápida no que ele vai fazer. Então, aqui vamos nós. Eu tenho que fazer uma seleção para estudar e você vê que uma vez que a seleção é feita, ele aparece aqui no campo de texto na escolha de você é descartado automaticamente. E se eu mudar de novo para o trabalho da casa, mesma coisa de volta para a codificação selecionada e demitida
15. Como criar o UIDatePicker: Agora estamos prontos para coletar a última informação do usuário, e essa é a data de vencimento para a tarefa. Então, como fizemos com os EUA, uma foto sua ia usar um seletor de encontros UI, que se parece com uma visão de você. Mas grande parte da lógica em termos do delegado e do protocolo é tratado pelo Iowa para nós. Então, o que vai começar fazendo é adicionar uma barra privada de fazer o selecionador de datas e o tipo será você, eu selecionador de datas. E a maneira como vamos configurar isso é muito semelhante a como fizemos o tipo de tarefa. Então, se entrarmos no método configure text fields, podemos ir em frente e começar a configurar isso. Então, podemos dizer que o seletor de data de vencimento é igual a uma nova instância de um seletor de data U I. E então o que vamos fazer aqui é realmente dar uma olhada nesta classe e ver o que está dentro dela. Então comando movimento e, em seguida, saltar para a definição de você. Eu selecionador de data e podemos ver imediatamente que a partir desta classe herda de você eu controlo e e s codificação. E você que eu controlo é outro vidro intermediário entre você, eu vejo e você, eu selecionador de encontros que tem mais controle ou propriedades relacionadas. Então, se voltarmos um nível aqui para o seletor de datas u I, notamos que algumas das propriedades temos nosso humor selecionador de datas Ah, calendário
local fuso horário a data Ah, em algumas coisas diferentes sobre data mínima data máxima definindo a data, etc. Você vai notar que não há delegado ou ah, fonte de
dados que temos que implementar aqui. E como eu disse no início, IOS praticamente lida com isso para nós. Eso É um tipo de fácil de usar uma foto de você para datas Agora há também o
modo de seleção de datas . Você tem data de hora oito, hora e contagem decrescente. Vamos usar a data para a nossa. Então o que vamos fazer é voltar e no nosso seletor de data de vencimento, você
faz seletor de data não modo de seletor de data é igual a data ponto E uma vez que temos agora
vamos para o nosso campo de texto,
que é o campo de texto de data de vencimento e o que vamos fazer para assinar a exibição de entrada igual ao seletor de data de vencimento. E novamente a razão pela qual isso funciona é porque, como você acabou de ver, a exibição de entrada é sua visão. O seletor de data de vencimento herda de você eu controlo que herda de você, eu vejo. Portanto, podemos atribuí-lo diretamente para ah view não, sem perguntas feitas. Então, nesse ponto, , ainda
há um pouco mais que precisamos fazer sobre, , na verdade lidar com a seleção. Então, mais uma coisa que quero dar uma olhada está dentro de você. Eu controlo Isso também nos permite basicamente adicionar eventos. Assim como nós,
hum, hum, lidamos com cliques de botão e o storyboard seco ser ações. Nós também pode adicionar manipuladores de clique botão problematicamente, e isso é feito através de adicionar alvo. E assim, uma vez que estamos em Stan Shading é controlado programaticamente, temos que nos certificar de que conectamos o valor selecionado alterado ou o manipulador programaticamente também. Três. Adicionar alvo, que vem de você. Eu controlo e, sem surpresa, você eu botão também deriva de você. Eu controlo, que é como ele é capaz de fazer com que os cliques do botão no alvo também. Então, vamos voltar e ver o que isso vai parecer para trás e tarefa Criador ver controlador . Precisamos fazer aqui é o seletor de data de vencimento subir a linha aqui. Deus selecionador de data de vencimento tinha o alvo e o alvo vai ser eu mesmo. São estes House Creator controlador de vista. Então, estamos adicionando esse alvo a essa classe, e isso vai ser uma ação ou um seletor. E o formato para isso vai se parecer com este seletor de hashtag e o nome da classe, que, neste caso, é criador encarregado, controlador de
visualização, e então precisamos dar-lhe um método que vai ser invocado. Então eu não criei esse método ainda, mas nós vamos nos dar bem. Chame isso. Vamos chamar este novo método data selecionada. Você sabe, nós só chamamos isso de, um, encontro aqui e para os eventos U I controle. Vamos usar o valor do pensamento mudado. E se dermos uma olhada nisso, mas comprometido clicando no valor alterado aqui, se eu pudesse entrar lá, vamos voltar para que um é este compilado porque ainda precisamos adicionar esse método. Então, o método que precisamos adicionar é funk data selecionada data você I d selecionador. Bem,
na verdade, ligue para isso só para ser claro Data, data
de seleção. Mas você está aqui, certo? E nós vamos precisar fazer mais uma coisa para que isso funcione pronto para adicionar em O B J c aqui e deixe-me ver o que este ar diz. Então à direita, aqui está a sua primeira instância Método data selecionada que não está exposta ao objetivo C anúncio em O B J C. Para expor este método de instância para o objetivo C. Então, se acertarmos, corrigir automaticamente o que você vai ver aqui é que vai, uh, colocar em O V J C na frente do método aqui e você vai ver que esse aviso vai embora. Então eu vou comandar para ser e construir bem rápido e verificar se tudo é compilado. E eu queria dar uma olhada aqui neste valor alterado e vamos ver se eu posso encontrar isso facilmente aqui, hum, procurar por valor alterado aqui. Então, há diferentes tipos de eventos de EW nos eventos EUA Controle dos
EUAatingidos aqui. Estamos interessados em ouvir a qualquer momento o valor muda. Basicamente, quando o usuário seleciona uma data diferente, este evento vai ser chamado, mas há outras coisas para lá é toque. Cancelar retoque externo retoque dentro, que é comumente usado para você. Eu botões, toque, arraste muitas coisas diferentes aqui que você vai querer dar uma olhada e ver o que pode fazer sentido para o que você está tentando didio se você está fazendo programático Uh, seletores da maneira que nós acabou de fazer. Então, vamos voltar. E agora que temos tudo isso ligado, mas podemos fazer aqui é imprimir o seletor de data tem data e vamos em frente e executar isso muito rápido no simulador e verificar se tudo está funcionando como esperado. Tudo bem, então vamos em frente e parar com isso e ver se nosso controle aparece e acontece. Você pode ver que ele tem três componentes. Tem um mês. Tem um dia e tem um ano. Então, se selecionarmos, digamos que abril agora você notará que o método selecionado de data que adicionamos programaticamente por meio desse método de destino de anúncio aqui foi invocado porque o evento de valor alterado foi acionado. Então, agora, se imprimirmos a data do ponto do seletor de datas aqui, vamos ver o que temos e parece com 18 2018 agora, tudo bem. Eu realmente não quero usar esse formato desnecessariamente. Então o que podemos fazer é usar uma data para a matéria para formatar a data que volta a um formato que parece um pouco mais bonito. E então combinamos isso com o campo de texto. Então, para formatação, a data, o formato que eu acho que será o mais fácil de usar aqui será esse tipo de capital de formato . Mm, dd Por quê? Por quê? Por quê? Por quê? Então isso vai ficar para o mês, o dia e depois o número 44 ano. E assim, a forma como nos conformamos na data que volta é usando uma data para a matéria. Então vamos apenas fazer Flett Date para matéria é igual a data antes da matéria. E então vamos definir o formato para essa string. Eu só digitei o comentário. Então data para a matéria dot oito formato que é igual a Não, basta usar isso exatamente como ele é porque é o formato certo que string lá. E então o que vamos fazer é deixar a data formatada é igual a data para a matéria ponto string do dia e a data que vai voltar é do seletor de datas aqui. Então ele está basicamente passando de volta no método aqui porque ele foi alterado. Então, selecionador de encontros. Não aquele. Não, não, não. Sem data do seletor de data data. E então, neste ponto, o que vamos fazer é realmente vincular esse valor de string ao campo de texto de data de vencimento. Então data de vencimento, campo de texto tem texto igual a data formatada. E o que vamos fazer é depois que nós vinculá-lo ao campo de texto irá descartar as
vistas de entrada . Vai fazer vista tem fim. A edição é definida como true, assim como fizemos para selecionar uma tarefa. Agora, vamos rodar isto no simulador, ver como é. Tudo bem, então vá para o então vá para ocampo de texto da data de
vencimento aqui,
e vamos em frente e escolher uma data diferente. campo de texto da data de
vencimento aqui, Vou tentar 18 de junho e olhar para isso. Então olhos seu seis para o mês 18 para a data ou o dia e, em seguida, 2018 para o ano. Vamos tentar escolher outra coisa que tentará. Talvez 18 de setembro. Vamos talvez aumentar o ano 2020. Talvez aumentar a data. Poucos dias. 22. Parece que tudo está funcionando lá. Se você voltar e tentar o outro campo aqui, hum, isso está funcionando como esperado também. Certifica-te que os meus teclados simulados funcionam aqui,teclado de
software e
viagem. Certifica-te que os meus teclados simulados funcionam aqui, teclado de
software e teclado de
software e
viagem. E com certeza, tudo está funcionando bem.
16. Melhoria da experiência do usuário: Agora, antes de estarmos prontos para criar a tarefa, há algumas coisas que queremos melhorar. Você percebe imediatamente que são chamados Botão fechado estão realmente perto da barra de status aqui, ao ponto em que ele parece visualmente desagradável. Então isso é algo que definitivamente queremos abordar. E além disso,
uh, uh, se um usuário acidentalmente abrir uma, hum, visualização de
selecionador um teclado ou um seletor de datas, mas não quiser fazer uma seleção a partir daí e não tem como descartar o ? Não há botão de fechar. Não há maneira de sair dela sem realmente fazer uma seleção na foto real de você. E isso é algo que também queremos melhorar. Então vamos começar com a barra de navegação e ver o que podemos fazer lá. Assim, o espaço padrão eram geralmente as alturas das barras de status 2020 pixels. Então o que nós faríamos é pegar nossa barra de navegação que temos agora e descer por 20 pixels lá. Então, se voltarmos para o quadro principal aqui, podemos começar a trabalhar nisso agora mesmo. E se entrarmos no controlador de exibição do criador de tarefas e descermos aqui para os problemas de
layout automático resultado , podemos selecionar-me restrições claras enquanto temos a barra de navegação selecionada para que ele só
remova as restrições para o barra de navegação. E uma vez que fizemos isso, estávamos livres para começar a mover a barra de navegação. E o que eu vou fazer aqui é ir para este pequeno ícone de régua aqui em cima para o inspetor de
tamanho, e eu vou começar a me mover. O eixo Y é como você aumenta o eixo y, ele vai realmente mover para baixo o controle ou o elemento que você manipulou. Então, queremos mover isso para baixo por 20. E uma vez que temos isso lá em ah, como se fosse 20. Mas podemos fazer é ir em frente e adicionar algumas restrições de volta para corrigi-lo nesta posição na maneira
mais fácil de fazer isso seria ir para o botão totalmente fora aqui, e vamos adicionar uma restrição superior, uma restrição direita ou direita, uma restrição esquerda ou esquerda e ah, vamos fazer uma altura de 44 lá e ah, vamos colocar isso fixo na posição Então agora vamos rodar isso no simulador e ver o que ele parece como é assim. Definitivamente parece melhor, mas podemos realmente melhorar isso e dar um passo adiante. Podemos realmente replicar a barra de navegação exata que um controlador de navegação usa por padrão dentro do nosso controlador de visualização modelo que não apresenta dentro da
pilha de navegação . E para fazer isso, precisamos realmente usar o delegado da barra de navegação são uma barra de navegação e usar um dos métodos
delegados para alcançar esse olhar. Então o que Weaken Dio é abrir o editor assistente aqui. Então temos nosso storyboard aberto e nosso código de um lado. E se formos para o nosso controlador de visualização do criador de tarefas, o que faremos é selecionar a barra de navegação e criar uma saída da Marinha para ela. Então segure a tecla de controle, clique e arraste para o controlador de exibição, e vamos chamar essa barra de navegação pode criar a conexão. E então o que vamos fazer aqui é uma vez que nós estamos indo para realmente usar o delegado
atribuindo-o , e se você fez, lead vai fazer barra de navegação ponto Delegate, que é uma
navegação U.
N. N. delegado bar é igual a si mesmo. Agora você vai notar que vamos obter um erro de compilação aqui muito rápido porque o controlador de visualização do
criador de teste não está em conformidade com este protocolo ainda porque acabamos de adicioná-lo. Então exatamente da mesma maneira que fizemos isso para a exibição do selecionador e o delegado do campo de texto. Faremos isso para o delegado da barra de navegação. Então vamos fazer isso criando uma extensão. Você está encarregado Creator View controlador, que está em conformidade com você, I delegar barra de navegação eo método que queremos usar a partir daqui. Se você começar a digitar a palavra posição quatro barras que retorna a, hum, posição da
barra, nós vamos voltar para cima anexado. Agora, vamos executar isso novamente no simulador e ver se isso fez algum tipo de melhoria em como nossa barra de navegação foi posicionada. Então você admite que a barra de navegação aqui está agora anexada ao topo muito semelhante a como ele são controladores de navegação. Barra de navegação é eso. Parece que ainda está no mesmo estilo, mesmo sendo um motivo. Apresentamos o controlador de visualização, então ele meio que funciona, e parece muito melhor do que o que tínhamos antes agora para descartar qualquer um dos
tipos de teclado que são apresentados. Seria ótimo se tivéssemos uma maneira de detectar se o usuário tinha tocado fora do teclado. E, de fato, há uma maneira de fazer isso. E podemos usar o que é chamado de “U I tap”. Reconhecer er para detectar um toque em um determinado que você tem elementos neste caso, gostaríamos de colocar esse toque na visualização controladores para determinar quando ele foi tocado e, em seguida, descartar qualquer coisa que possa estar aberta. Então o que podemos fazer aqui é criar um novo método. Hum, funk
privado configurar, toque gesto, reconhecer er e podemos chamar isso em vista. Carregou logo depois que chamamos configurar campos de texto. Então configure toque gesto Reconhecer er e vai criar um novo, uh, gesto. Reconheça-a assim. Então deixe algum gesto toque reconhecer er igual a que você eu toque gesto. Reconhecer er e o inicializar usará Aqui é o alvo e a ação, assim como fizemos antes Para o selecionador de datas U I. Vamos fazer a mesma coisa de novo, programaticamente uh, adicionando basicamente um manipulador de torneiras. Clique em Candler Então, o alvo neste caso será auto para o criador de tarefas real controlador E o seletor será o método que é chamado quando o toque é selecionado. Neste caso,
ainda não escrevi esse método,
mas começarei escrevendo o seletor. Neste caso, ainda não escrevi esse método, E será o controlador de visão do criador de tarefas, um ponto detectou? Sim, e aqui mesmo, toda a função criativa. Abra onde temos o outro. Funk detectou torneira e vamos ver se conseguimos agora provavelmente vai reclamar. Aqui, deixe-me ver se Ah, ainda
não. Nós precisamos expor em o b j C. Porque eu disse que este método pode realmente ser usado no objetivo C da maneira que ele está sendo inicializado em Swift. Pelo menos deixe-me verificar se isso está lá. Então OK, detectou aplicativo está lá. E, hum, se quiséssemos passar no gesto, reconhecer? Er, hum quando uma maneira de fazermos isso é, hum, reconhecer er assim. E então, se formos até aqui, vamos em frente e certificar-nos de que isso se constrói e faz. Então isso é uma coisa que você pode fazer se você passar nesse parâmetro. Basicamente, você está passando, uh, o controle que foi interagido neste caso, o reconhecimento. Então, se precisarmos de propriedades específicas no reconhecimento ou poderíamos passá-lo assim ou poderíamos ter apenas deixado é uma função vazia. Isso realmente não importava no caso da data selecionada quando precisávamos do seletor de data para obter Thea obter a hora ou a data que foi selecionada. Eso é apenas 11 maneiras de fazer isso. Eso não terminamos aqui. Ainda precisamos adicioná-lo. Então vista, que é a vista Controladores de você não adicionar gesto Reconhecer er o gesto toque reconhecer er er si mesmo. Então, agora estamos ouvindo torneiras e na detecção real de um toque que vamos fazer aqui é chamado de visualização Got final edição disse que True, Vamos em frente e testar isso no simulador e ver como ele se desenrola. Tudo bem, então dentro da criação de um novo controlador de tarefas, vamos ver aqui para que possamos trazer nossa foto de você. E se eu tocar fora dos gestos de toque detectados e nós descartar o teclado chamando
edição final e vamos experimentá-lo na data de vencimento. Enfraquecer os negócios a partir daí. Vamos tentar no teclado para o título. Quando você descartar de lá, vamos tentar digitar algo aqui, descartando. Nós ainda podemos fazer nossas seleções regulares porque normalmente fazemos. Estalando uma data, talvez fechemos de novo, mas não queríamos abri-la, e não queremos fazer uma seleção. Então, nós apenas saímos rápido e isso cobre todos os nossos casos de uso aqui. Então, neste ponto, nossas experiências de usuário que muito melhorou em, e estamos prontos para criar a tarefa e passar isso de volta para o para fazer lista tabela exibir controlador e adicionado à lista.
17. Como criar a tarefa do TOD: Então agora estamos também e prontos para realmente criar a tarefa. Hum, Então o que queremos fazer aqui é ir para baixo para o método criar tarefa tocando aqui, e este é o lugar onde vamos pegar toda a entrada que o usuário gerou e criar a tarefa em descartado este controlador de visão automaticamente. Então, para começar, queremos fazer algumas verificações de sanidade. Queremos ter certeza de que podemos obter todos os atributos e não temos nenhum problema. Então, a primeira coisa que queremos verificar é obter o título da tarefa que o usuário colocou em para que
possamos fazer uma verificação para o título da tarefa. Vamos fazer um título de tarefa let é igual a tarefa, seu texto campo de texto título ponto texto e podemos fazer aqui é guarda. Deixe-o retornar ehlz, e vamos apenas colocar impressão falhou para obter atributos necessários. Então, se formos em frente e se nos lembrarmos para criar uma nova tarefa, temos que dar um título,
uma data de vencimento e um tipo de tarefa real. Então, além de tudo isso, o que também podemos fazer é verificar os dois outros atributos que precisamos agora, além de apenas o título da tarefa que precisamos verificar para a data de vencimento e o tipo de tarefa. Mas também apenas verificar se há novos não é suficiente. Ah, usuário também pode deixar de adicionar em qualquer texto, mesmo que o atributo de texto não seja nulo, pode não
haver nenhum caractere no campo de texto, então precisamos expandir nossa verificação para considerar também esse cenário. E podemos fazer isso com bastante facilidade expandindo nossa declaração de Guarda com um título de tarefa que conta maior que zero, que basicamente diz que tem que haver caracteres neste campo de texto título aqui antes considerá-lo Ballad on. E se você não está familiarizado com a declaração da Guarda, é basicamente como se algo não for igual a verificação nula, no entanto pode ser usado mais explicitamente porque guarda representa muito feno. Algo pode dar errado aqui, prestar atenção e vamos usar um programa ou saber que existem alguns casos que você precisa verificar . E você sabe que este caso aqui é basicamente equivalente a se, você sabe, campo de texto
título fora texto não é igual nulo e tarefa intitulada que contagem é maior que zero , exceto em um guarda Vamos estilo sintaxe para que possamos expandir sobre isso para os outros campos exatamente da mesma maneira. E se tivéssemos uma vírgula aqui antes do resto, também
podemos fazer isso. o Deixeotipo de tarefa. O texto é igual a tipo de tarefa, texto, campo, texto e tipo de tarefa. Contagem de texto é maior do que zero em nosso caso final para esta verificação vai ser deixado
data de vencimento . O texto é igual à data de vencimento, texto do campo de texto e à conta de texto da data de vencimento criada em zero E isso nos cobrirá para que tenhamos certeza de que temos texto válido para todos os nossos campos em
vez de apenas imprimir se algo der errado. Não seria bom se pudéssemos ver algum tipo de estandarte ou um alerta? É muito fácil fazê-lo. E podemos fazer isso com o que é chamado de controlador de alerta U I, que exibe basicamente uma pequena mensagem pop-up com um título e algum texto e um botão para que
possamos configurar uma nova função para esse erro de exibição de funk privado e string de título de erro tensão de mensagem de erro, e vamos criar uma nova instância de um você quer. Troller. Vamos Ah, erro Alert Controller é igual a au controlador de alerta alto. E para o Isar inicial usará o título da mensagem em grande estilo. Vamos passar em erro, mensagem era
título e para o título do estilo. Quero dizer, vamos usar o alerta. Há também uma folha de ação, mas isso não é relevante para este tipo de mensagem de erro. Então isso nos configura para o título e a mensagem. Mas também precisamos adicionar no botão ok onde o botão para descartar a exibição de alerta ou o controlador de alerta. Então podemos fazer isso criando uma ação de alerta u I. Então vamos, um certo, ação é igual a você. Eu alerta ação para o Isar inicial para o estilo de título e Manipulador, e para o texto ia colocar ok para o estilo. Eu vou colocar, hum, padrão. E para o manipulador, isso é apenas, ah, o fechamento do retorno de chamada para quando o botão é clicado. Se você precisa fazer alguma lógica, mesmo que seja opcional, eu vou implementá-la apenas para que você possa ver como ela se parece. Então, Prince, o manipulador de botões bem foi chamado. E uma vez que nós
criamos isso, nós só temos que adicionar isso ao controlador de alerta. Pensei em ação publicitária. Você adiciona o ok, ação. E, finalmente, precisamos apresentar o controlador de alerta. Da mesma forma que teríamos controlador de visão modelo. Então, nós apenas chamamos presente erro Alert Controller Animated True. Manipulador de conclusão, Nil. Nós realmente não nos importamos com o que acontece e vamos em frente e executar isso, mas vamos fazer isso com Bad dentro Mas vamos testar o banho não feliz. Portanto, queremos que qualquer ou todos os nossos campos estejam vazios para que possamos ver que o nosso controle de alerta está sendo chamado. Então eu vou aqui, basta ligar, criar uma tarefa sem nada nela. Você pode ver que eu recebo a mensagem também se você olhar para baixo nos registros, você pode ver que o manipulador ok foi chamado. Então isso significa que isso está recebendo uma ligação de volta. Uh, civil. Então, por exemplo, se eu digitar aqui e apenas que criar hit,
ok, ok, vamos ver este ponto de freio é atingido porque o fechamento do manipulador ah está sendo alcançado bem aqui. Então, hum, então nós sabemos que isso funciona. Hum, e agora estamos prontos para prosseguir com, realmente construindo nossa tarefa, então agora temos o título, o tipo e
o texto da data de vencimento. Agora precisamos construir o tipo e a data a partir destes então precisamos fazer o próximo. Está começando com a data vai criar uma, hum let date para a matéria Igual a fez antes da matéria e deixar, hum, data de vencimento
é igual a data de início da matéria da string, que a string será texto de data de vencimento e você vai observe que este retorna e opcional aqui. Então nós também vamos precisar fazer uma verificação para que possamos fazer,
guarda, guarda, deixar o cara igual a que mais voltar. Mas antes de
retornarmos, também podemos exibir outro erro. E isso pode ser um cenário em que o usuário alterou o texto no campo de texto, uh, para outra coisa. E não é mais uma validação. Então nós colocamos, hum, data
inválida. Houve um problema com a data e ah, última verificação precisará fazer é para a tarefa. Então vamos nos certificar de que nossa tarefa let é igual a tarefa. Eu sinto muito. Tipo de tarefa é igual a tipo de tarefa a partir do valor bruto de força, e essa string vai ser o texto do tipo de tarefa, e ele também retorna um opcional, Então nós também estamos eu preciso verificar para que nos turn, e nós vamos apenas fazer o A mesma coisa aqui. Exibir outro erro se tivemos um problema na tarefa Balad. Ok, há um problema com o tipo de pergunta, e se tudo isso der certo, então estamos prontos para ir. Então deixe-me tarefa é igual a tarefa para o título do teste aqui em cima, a data de vencimento a partir daqui e o tipo de tarefa a partir daqui. E nesse ponto, podemos chamar demissão, que nos levará de volta ao, hum para fazer lista tabela de controle. Então vamos chamar a verdadeira conclusão animada para não antes de executarmos isso. Vamos também certificar-nos de que estamos verificando o formato de data que definimos abaixo. Então, se você se lembrar de volta aqui para o
mês, mês ,
dia , ano, nós queremos usar o mesmo formato. Então vamos apenas copiar isso e em nosso cheque aqui, certifique-se de que o formato é o mesmo. Ah, e agora vamos fazer isso e brincar e ver se podemos criar uma nova tarefa e verificar se em casos válidos estão sendo protegidos agora, vamos apenas dizer, lavar o carro. Vamos apenas dizer que é trabalho em casa e vamos dizer que eu preciso fazer isso até amanhã. Mas digamos que eu mude otrabalho
da casa para um tipo de tarefa que não existe,
como o trabalho do carro. trabalho
da casa para um tipo de tarefa que não existe, E então eu bati. Criar tarefa. Você verá que o tipo de tarefa inválido surgiu porque houve um problema com o tipo de tarefa. Eu não poderia Eles não poderiam construir um caso para isso porque não é um dos nossos tipos suportados , hum, na enumeração. Então, se colocarmos isso de volta no trabalho doméstico, faça isso agora vamos dizer que cancelamos a data. Ao colocar uma data inválida na rejeição da criação,
houve um problema com a data. Ao colocar uma data inválida na rejeição da criação, Está bem, fixe. Então isso parece estar pegando isso. E digamos que temos tudo o resto, mas por alguma razão, decidimos que Teoh omite o título completamente. Ele criar tarefa, faltando atributos necessários. Então estamos muito bem protegidos aqui sobre as coisas atrás. Um pouco estranho. E agora, uh, finalmente lavar o carro, que agora este é o nosso caso válido. Vamos em frente e criá-lo. E com certeza, criamos a nova tarefa e dispensamos o controlador de visualização Agora temos um problema. Como chegamos à nova tarefa de onde ele estava no criador de tarefas de seu controlador, de volta para o controle de exibição de tabela de lista para fazer e, mais importante, tê-lo adicionado automaticamente à exibição de tabela. Isso é algo que ainda não conseguimos fazer neste momento. E isso é algo que vamos resolver implementando nosso próprio protocolo. Esse será o nosso delegado, e nosso delegado será notificado para quando uma nova tarefa foi criada e será capaz de adicionar essa nova tarefa ao nosso controlador de exibição de tabela automaticamente.
18. Introdução com protocolos e delegação: Então, em nosso último vídeo, nós fomos confrontados com o dilema de como nós realmente passar a nova tarefa de volta para a nossa tabela de
lista de fazer de você controlador. E embora haja algumas maneiras de fazer isso e não necessariamente uma resposta vermelha específica , este é um bom ponto para começar a falar sobre partículas e o
padrão de design de delegação . Então vamos começar por pode estar criando um exemplo rápido em um playground. Só podemos ilustrar o ponto de forma isolada e, em seguida, tomar esse conceito e aplicá-lo ao nosso aplicativo. No meu playground rápido aqui, eu criei uma classe muito básica sobre, e esta é uma classe chamada apenas animal de estimação com uma propriedade, um nome, um Isar inicial que atribui esse nome. E este animal de estimação pode ser qualquer coisa. Pode ser um cão. Um pássaro pode ser um gato. Pode ser algo mais exótico, talvez até uma cobra. Então, um protocolo é basicamente um blueprint, um blueprint de funcionalidade. Então, se quiséssemos definir um cão para comportamentos que pertencessem ao cão, poderíamos criar um protocolo chamado Dog. Poderíamos dizer que este protocolo tem um parque de eventos e talvez esta partícula tenha uma raça
específica para o cão. Então talvez um bar, uh, raça do tipo corda. E em um nível muito básico, isso significa que qualquer classe que esteja em conformidade com o protocolo do cão deve ter uma raça, e deve ter a capacidade de latir. Então, digamos, por exemplo, tornemos o animal de estimação em conformidade com o cão para que possamos fazer isso da seguinte maneira. Nós poderíamos fazer isso. O este estilo de sintaxe aqui. E quando fizermos o animal de estimação se conformar com o cão, você verá que estamos tendo uma era imediatamente que não está em conformidade com este cão protocolo . E se você clicar na mensagem de erro, ele pergunta se queremos adicionar stubs de protocolo. E se batermos, conserte o que vai acontecer. É códigos X automaticamente vai adicionar na raça para uma propriedade e uma função chamada Bark? E está fazendo isso porque sabe que isso é o que definimos no protocolo
aqui . E então nós temos que ter esse comportamento porque o protocolo exige que nós diamos para que possamos fazer algo como impressão. Por exemplo, um nome latiu alto. Nós também podemos injetar em uma raça aqui para o tipo de que pertence a esse cão para que
pudéssemos fazer auto-ponto raça igual a raça, e isso meio que garante uma maneira de garantir que esta classe vai dedo do pé tem certas coisas que nós especificamos Aqui. Então, se adicionarmos o parâmetro faltando para a raça e vamos dizer Fluffy é um pug agora quando eu posso fazer aqui é em vez de que eu posso dizer animal de estimação, não trabalhar em vez e vamos ver que Loving latiu alto e fofo. É uma leitura ou um pug que parte alto para que o problema um pouco mais sentido no contexto aqui. E então essa é uma maneira de fazer uma classe estar em conformidade com um protocolo, as outras maneiras através de extensões. Então, temos feito isso praticamente o tempo todo. Hum, como você viu com o delegado de exibição de tabela U I e fonte de dados, o que você I picker view delegar na fonte de dados. Estávamos implementando tudo isso através de extensões. Então, agora que entendemos protocolos,
vamos mudar de marcha e falar sobre o pó de design de delegação. Então, nos termos mais simples, delegação é basicamente um padrão onde um objetor, uma coisa pode delegar responsabilidades para outra entidade, classe ou coisa que irá agir em seu nome. Agora é melhor ilustrado através de um exemplo, e eu acho que vai fazer muito sentido uma vez que eu mostrar este pedaço de código aqui. Então vamos
supor, por exemplo, que temos uma classe chamada dono do animal de estimação ou bebê. Vamos chamar um dono de cachorro, hein? Agora é o dono do animal de estimação e vamos criar outro político chamado delegado cão. E digamos que este protocolo tem uma função. Cachorro fez latir. E assim nosso dono de estimação tem um animal de estimação. E vamos apenas dizer que o nosso verdadeiro het aqui e neste caso vai apenas assumir que é Ah ,
cão, cão, hum, tem um delegado. Então vamos fazer delegado var do tipo cão delegado como um opcional apenas começando. E não se preocupe se isso é um pouco confuso, tudo faz sentido uma vez que tudo está pronto. Então, nosso dono de estimação, digamos que ele tem um nome, que é o tipo de string. Digamos que ele tenha um animal de estimação e o inicializaremos com um nome e um animal de estimação. Até agora,
tudo bem. Hum e então o que podemos fazer aqui é realmente em Stanciute nosso dono. Então vamos fazer isso aqui. Nós diremos isso. Deixe o proprietário do corte é igual ao dono do animal. O nome dela será Jim. E esse será o animal de estimação que acabamos de criar acima, que é o nosso pug. E vamos mudar o nosso nome de animal de estimação. O Teoh. Apenas o nome. É um inseto. E assim, até agora, tão bom. Então nós temos que configurar aqui. Lembrem-se
que estabelecemos esta propriedade delegada aqui,
e o que podemos dizer é que o dono do animal de estimação vai estar em conformidade com o delegado do cão,o
que significa que o dono do animal é o delegado ou age em nome de seu animal de estimação,
enquanto Doc. Lembrem-se
que estabelecemos esta propriedade delegada aqui, e o que podemos dizer é que o dono do animal de estimação vai estar em conformidade com o delegado do cão, que significa que o dono do animal é o delegado ou age em nome de seu animal de estimação, neste caso. Então o que podemos fazer é criar outra extensão que podemos criar extensão. E é exatamente assim que temos feito isso por você. Eu escolho de você delegar na fonte de dados, vista de
tabela delegar na fonte de dados. Então extensão no proprietário do animal de estimação, que está em conformidade com o delegado do cão. E agora, se deixarmos sentar aqui, teremos um erro de compilação dizendo que não
estamos em conformidade com o protocolo. Temos que implementar o método que o cão fez Mark. Então começamos a digitar o cachorro não latiu. Agora o nosso delegado é o dono do animal de estimação. Pode reagir e fazer algo sobre isso. Talvez ele tenha notificado isso. Preciso de alimentar o meu cão a qualquer momento, o cão late. Então, como invocamos isso? E para mim aqui, bem, precisamos realmente de um sinal os delegados. Então, se o dono do animal de estimação está de acordo com o protocolo e o que podemos dizer, delegado de ponto de
estimação é igual a si mesmo. E a razão pela qual podemos dizer eu mesmo é porque eu se refere porque ele está dentro do
dono do animal de estimação . Classy refere-se ao dono do animal de estimação. E porque esta extensão do dono do animal de estimação está em conformidade com o delegado do cão, essa é a razão pela qual podemos atribuí-lo a si mesmo. O que significa que assim que tivermos esta propriedade aqui, estamos ligados à cadeia de delegados. Estamos ouvindo quaisquer notificações ou eventos que são cão pode acontecer de emitir. Agora, para invocar isso, nós temos que realmente a partir da classe de saúde ou do protocolo cão. Temos de ir em frente e informar o nosso delegado que, neste caso, nosso delegado é dono de animais de estimação. Que algo aconteceu. Então, neste caso, quando o latido é chamado depois de uma declaração de príncipe, podemos dizer que o delegado Dot o cão dela não latiu e vai acontecer aqui é depois que formos em frente e estabelecermos nossos relacionamentos aqui. Se dissermos “pug dot bark “, vamos ver os registos da consola aqui em baixo. Então vemos aqui Fluffy é um pug que latiu alto, que é esta declaração de impressão. Fui demitido e depois o delegado é notificado. Quando os delegados notificaram o dono do animal de estimação que vem aqui nessa declaração é executado. Preciso de alimentar o meu cão. Então, agora o dono do animal de estimação está ciente de que algo aconteceu e o proprietário é fazer algo sobre isso. E podemos usar esse conceito para exatamente a mesma situação para a nossa nova tarefa e informando nosso para fazer o controlador de exibição de tabela que não há sua tarefa e precisamos fazer algo sobre isso novamente para resumir que a razão que usamos protocolos para delegados é porque eles são o esquema que definiu o comportamento neste caso, cão não latido deve ser implementado por qualquer delegado que esteja em conformidade com o
protocolo de delegado cão . Agora, para o nosso aplicativo são a nossa lista de fazer. Controlador de exibição de tabela vai se tornar o delegado para o controlador de exibição de criador de tarefas . Então, sempre que criarmos uma nova tarefa, nosso criador de tarefas vai informar qualquer delegado que ele tem que criou uma tarefa. E os nossos delegados neste caso serão apenas a lista de coisas a fazer. Controlador de exibição de tabela será notificado de que uma nova tarefa foi criada. Podemos passar essa nova tarefa como um parâmetro dentro do método e, em seguida, adicioná-lo à
vista de tabela enquanto fazemos a demissão da nossa lista real para fazer. Nossa tarefa. Criador de seu controlador. Então, agora, tomando o que aprendemos aqui sobre verticais e delegados, vamos implementar nosso próprio delegado e realmente ligar isso para que possamos adicionar a nova tarefa à nossa tabela de vocês.
19. Como criar nosso próprio delegação: agora, tomando o que aprendemos com o tutorial anterior, podemos fazer nossa própria tarefa do Criador delegar. Então vá para a parte superior do controlador de visualização do Criador de tarefas de volta no projeto principal em que estávamos trabalhando. Vamos criar um novo protocolo acima da nossa classe. Esse protocolo será chamado de tarefa Criador, delegado. E por agora, vamos apenas adicionar um método. Funk criou uma nova tarefa e irá fornecer a nova tarefa como um dos parâmetros para a assinatura do método. E vamos chamar essa tarefa aqui. Então é só isso que as partículas vão ter? É muito simples. Um método. Não muito. O Teoh. Sim, conformado. Então, agora, volta no controlador de visão do criador tarefa, Precisamos criar qualquer propriedade, a propriedade delegate. Então, vamos fazer um delegado var do tipo de tarefa criador, delegado, e você vai querer tornar isso opcional porque o controlador de exibição do
criador de tarefas pode não ter um delegado. Outra classe pode não ter atribuído a si mesmo para ser o delegado para este controlador de exibição. Portanto, não queremos tentar invocar um delegado que não existe. Então, ao torná-lo opcional se o invocarmos e ninguém estiver inscrito neste delegado, não
teremos uma falha de tempo de execução. Então agora precisamos descobrir onde realmente fazemos essa chamada de delegado ou quando
notificamos quem está ouvindo do outro lado que uma nova tarefa foi criada? Bem, o lugar lógico para fazer isso seria dentro do método criar tarefa tocado aqui. Uma vez que nós realmente chegamos a baixo para a criação de novas tarefas. Portanto, aqui mesmo antes de fazermos a nossa demissão, podemos simplesmente fazer isto. Delegar ações fez criar nova tarefa e passar a nova tarefa assim. E novamente, embora isso seja opcional aqui, se ninguém se designou para ser o delegado, então tudo bem. Isto só vai passar por cima. Não vamos cair no nosso trabalho de maçãs como esperado. Então, agora vamos voltar para a lista de tarefas do controlador de exibição de tabela e certifique-se de que ele se torna o delegado para o criador de tarefas. Então, na nossa lista de coisas aqui, hum, nós provavelmente queremos didio é se livrar dessa fonte de dados estática que nós definimos aqui porque lembre-se que estávamos usando revestimento duro, uh, no momento. Mas nós vamos tornar essas dinâmicas agora criando a nossa própria para que possamos ir em frente e comentar a construção de uma fonte de dados por enquanto, ou removê-la o que você escolher fazer. Se você fizer uma barra de comando você pode destacar um bloco aqui e comentou em um Go. Gostaria também de comentar à vista. Carregou onde chamamos isso, e uma vez que fizemos isso, precisamos fazer aqui é fazer esse cara isso para fazer lista de tabela de exibição, classe de
controlador em conformidade com esse protocolo. E assim, assim como fizemos no tutorial anterior, podemos criar uma extensão em um controlador de exibição lista lista. Isso está em conformidade com o criador da tarefa, delegar. E você pode querer fazer um comando ser construir seu projeto aqui porque às vezes o México tem dificuldade em encontrar isso, e uma vez que ele encontrá-lo, nós vamos implementar esse. Não que criamos chamado criou uma nova tarefa. Então, uma vez que essa nova tarefa foi criada, vamos ser notificados bem aqui sobre isso, e então podemos fazer algo com ela, que no nosso caso aqui está adicionando isso à nossa fonte de dados e, em seguida, recarregando nossa tabela vista. Mas ainda não terminamos. Nós não fizemos a atribuição, basicamente atribuindo a fazer este controlador de exibição de tabela para se tornar o delegado. Agora, se você se lembrar como chegamos ao criador de teste, se voltarmos para o quadro principal da história quando realmente apertamos o botão mais Ah, no controlador de visualização de tabela que automaticamente segue pesado sobre a criação de nova tarefa . Então, aqui mesmo, quando pressionamos isso nós Segway aqui para aqui. Agora, a boa notícia está dentro da nossa lista de tarefas. Controlador de vista de tabela estão preparados para Segway. Método vai ser notificado, logo quando isso está prestes a acontecer e você pode ver exatamente da mesma maneira que tentamos
descobrir o destino Segways para descobrir o que você controla ou estamos indo Teoh, Podemos usar essa mesma abordagem aqui e descobrir se estamos indo para o criador de tarefas e se estamos ir em frente e atribuído os próprios delegados logo antes deste método terminar. E isso é exatamente o que vamos fazer. Então prepare-se para Segway. Temos que estar conscientes de onde colocamos este pedaço de código. Porque se olharmos para estes guardas, vamos voltar muito aqui se certas coisas não acontecerem. Então, por exemplo, se estamos tentando esperar uma célula de visualização de tabela u I, por exemplo, se quiséssemos ir ao detalhe de você, mas não conseguimos, então retornamos. A mesma coisa se não pudéssemos obter um caminho de índice ou um controlador de visão detalhada. Então nós realmente não queremos colocar nosso código abaixo aqui porque ele vai falhar se nós
realmente não estamos indo. Teoh o controlador de visualização de detalhes. Então, se colocarmos em cima, aqui está nosso primeiro cheque. Então, o que podemos dizer é, se deixar o controlador de exibição do criador de tarefas é igual ao destino Segway, que é que você tem o controlador, podemos lançar isso como um controlador de visão de criador de tarefas. Então, se isso se deixar a verificação for bem sucedida, então podemos dizer simplesmente, o controlador de visão do criador de tarefas, Eu pensei que delegar é igual a si mesmo e auto sendo a tabela de lista a fazer você controlador porque temos conformado com isso protocolo aqui e, em seguida, o que vai acontecer neste caso é que ele vai continuar para baixo através desta guarda, Vamos verificar e, em seguida, retornar porque não é uma tabela de você vender. Então não vamos ter nenhum problema lá. Nós não conseguimos realmente fazer a tarefa, e então podemos fazer. Aqui é quando isso é notificado. Então enfraquece a declaração de pegada aqui. Imprime uma nova tarefa detectada. Podemos adicioná-lo à nossa fonte de dados. Então, se você se lembrar, aqui estão as fontes de dados, uma série de tarefas, e nós simplesmente o upended. Nós duro revesti-lo no início deste tutorial, mas agora podemos upend-lo a partir daqui. Então fonte de dados que anexam tarefa. E se chamarmos uma exibição de tabela de recarga de dados depois de upended, ele irá automaticamente recarregar cada linha. Então vamos em frente e testar isso no simulador e ver como ele se parece. Nosso em nosso vazio para fazer lista tabela exibir controlador. Removemos o material codificado lá dentro. Então, se formos para o ícone de adição aqui para criar uma nova tarefa, vamos chamar isso detutorial de
codificação,
e parece que meus teclados simulados não aparecem. tutorial de
codificação, Então o que eu posso fazer aqui é ir para hardware enquanto eu tenho o simulador selecionado em um teclado e Tuggle o teclado de software. E assim que chegarmos ao tipo de tarefa, eu ia terminar a codificação selecionada e eu vou dizer que a data de vencimento é amanhã e um gnomo e vá em frente e crie essa tarefa e veja isso. Então, se você olhar aqui no registro,
a nova tarefa detectada foi chamada e nós upended essa tarefa, que significa que isso foi chamado de volta e nós recarregamos os dados para a tabela de você. E vamos fazer mais uma e eu vou até jogar um ponto de pausa aqui para que você possa ver passo a passo. Então vamos dizer que queremos entrar em uma segunda tarefa. Então, hum, vamos apenas dizer Ah, limpeza ou documento já que temos um tipo de tarefa de trabalho doméstico. Então trabalho em casa e vamos dizer que vai ser feito no dia 22 de merchandismo que ele criar e assistir. Então boom, nosso delegado, que é feito para fazer lista tabela de controle de exibição é notificado imediatamente. A nova tarefa passou. Nós dependemos disso. Recarregar os dados e Walla Now Temos duas tarefas. E se quiséssemos entrar em detalhes de você para um deles são velhos. O código ainda funciona exatamente da mesma maneira que podemos. Podemos entrar em cada um deles. No entanto, ainda não
implementamos
isso, então não vai mostrar nada. Mas tudo ainda funciona. E então agora, hum, agora que temos que trabalhar dinamicamente, o próximo passo neste tutorial será implementar o controlador de visualização detalhada para quando adicionarmos uma tarefa, em
seguida, fazer uma seleção sobre isso tarefa. Queremos exibir isso aqui e bonito até a interface do usuário porque ele está muito vazio
no momento.
20. Estilo do controlador de visão detalhada: Agora tudo o que resta é o estilo do controlador de vista de detalhes e para torná-lo bonito e mostrar os dados que estamos passando a partir da tabela de lista para fazer se você controlador, que é a tarefa selecionada. Então, se voltarmos ao nosso controlador de visão detalhada aqui, você verá que tudo o que temos é a tarefa que passamos. E então imprimimos dentro de você carregou. Então vamos ter que voltar ao nosso storyboard e começar a configurar alguns
elementos U adicionais para configurar. Se voltarmos ao storyboard e olharmos para o nosso controlador de visão detalhada aqui, é bastante estéril. Então vamos em frente e começar a adicionar em alguns elementos de interface aqui. Mas podemos fazer é ir até a biblioteca de objetos na parte inferior, direita, e podemos adicionar alguns rótulos para começar. Então procuramos por você. Eu rotulo podemos arrastar um sobre o controlador de visão aqui, e vamos apenas tentar aumentar o dentro da altura e dar a este uma boa posição. Podemos começar a partir do centro do controlador de visão, então trabalhar como precisamos e o que podemos fazer aqui é centralizar o texto e,
uh, uh, vamos dar a isso um pouco mais de espaço pode ser arrastado para as bordas. Basta dar-lhe espaço máximo e estas pequenas linhas azuis pontilhadas. Ou defina diretrizes que informam as áreas seguras onde você pode posicionar seus elementos e vamos em frente e começar com este para o título. O que faremos aqui é abrir o editor assistente. Sim. Quero dizer, basta arrastar isto para cima, homem vai abrir o controlador de visão diesel de um lado aqui. E então o que vamos fazer é começar a criar algumas conexões. Então, vamos nos conectar sobre o rótulo, e este vai servir como nosso rótulo de título. Então isso é chamado este rótulo de título de tarefa. Você conectá-lo e vamos em frente e criar mais alguns. Então eu sou o que eu vou fazer aqui é copiar esta etiqueta. Se você fizer comando, ver para copiar ou simplesmente selecionar o rótulo em fazer editar cópia, você pode alcançar o mesmo resultado, e comando V o não é Victor. Poderíamos colá-lo. Há mais dois. Um para o tipo e outro para a data de vencimento. E então vamos em frente aqui e tentar alinhá-los. Então, vamos lá e mova isso um pouco. E podemos selecionar todos os rótulos de uma só vez mantendo pressionada a tecla shift, clicando cada um de cada vez para seleção múltipla. E podemos arrastar estes para cima e tentar obter algum tipo de no centro assim. Agora você vai notar aqui que eu estou vendo isso como um iPhone 8. Agora temos que ter cuidado aqui, porque nosso título pode ser longo. Pode ser grande, Hum, e nós temos que ter certeza de que isso vai ficar bem em um tamanho de tela de dispositivo menor. Então, antes de realmente ligar quaisquer restrições, vamos definir algumas fontes para esses rótulos. Vamos começar com o título e selecioná-lo. Eles vão para o Inspetor de Atributo aqui no lado direito, e nós vamos mudar a fonte para algo diferente. Eu vou digiar na avenida ou diversão, então eu estou pensando que Avenir próximo vai mudar o estilo muito ousado, e vamos fazer um tipo de maior. Então ele se destaca. Acho que 32 provavelmente é grande o suficiente e para o outro para o tipo nas datas de vencimento. Vamos em frente e definir aqueles, um Teoh Avenir próximo, mas um diferente que não vamos usar ousado, vamos usar. Eu acho que médio provavelmente vai parecer OK e vamos em frente e bater isso para cima. Acho que o Teoh 26 parece muito bom. Faremos a mesma coisa para a data de vencimento, que é a terceira etiqueta aqui. Então a avenida próxima tamanho médio 26 e vamos fazer isso aqui. Ok, então isso parece muito bom até agora. E então agora que temos isso, vamos tentar e realmente adicionar as restrições de layout automático para corrigi-los nas
posições apropriadas . Então, se começarmos com nossa etiqueta de título e irmos em frente e selecioná-la, se
descermos aqui, podemos ver que está 146 longe do top 16 do lado esquerdo e 16 do
lado direito e 37 para baixo. Então, digamos que queremos manter um certo espaçamento entre os rótulos abaixo dele. Obviamente, poderíamos usar uma exibição de pilha como usamos antes no controlador de exibição do criador de entrada, mas outra outra coisa que podemos fazer aqui é meio que mover nossos rótulos ficando meio
próximos uns dos outros. E podemos então olhar à medida que fazemos alterações verticais que o que era 37 agora se tornou oito pixels ou estar ou oito pixels de distância de onde o rótulo do título está. Então, se eu quiser mover estes para baixo um pouco mais, digamos, uh 123456789 10 e manter um espaço de 18 de distância. Eu posso fazer isso aqui e também para Se eu selecionar meu rótulo de tipo de tarefa, eu vejo que ele também tem seus oito pixels de distância da data de vencimento. Então, se eu quiser manter esse espaçamento igual, eu posso ir em frente e selecionar a data de vencimento. Aumente o eixo y mais, o que o empurra para baixo. Eu poderia fazer isso por um valor de 10 e então eu posso voltar e verificar se o tipo poderia ver isso. Ok, é aos 17, então eu preciso aumentar isso mais um, e eu poderia manter o espaçamento lá de 18 entre todos eles. Assim que fizermos isso, o que podemos fazer é selecionar cada um deles novamente, e podemos arrastá-los todos juntos e realmente procurar esse centro. O guia de layout mostrará onde ele ISS neste momento. O que podemos então fazer é com todos eles selecionados, podemos ter várias restrições ao mesmo tempo. Então vamos dizer que queremos adicionar uma restrição à esquerda e à direita para que 16 de distância de cada diretriz de
layout, Vamos em frente e dizer Queremos corrigir a altura em 55 para cada um destes. Vamos adicionar isto para ver o que acontece. Então, quase estamos tendo um problema aqui porque ainda há algumas informações. O layout automático precisa entender onde posicioná-los. E se olharmos para as medidas de ar reais que estamos recebendo, precisamos de uma restrição para a posição Y. Então o que nós basicamente queremos fazer é tentar dizer, Ei, layout
automático. Queremos um médico, cada um desses rótulos, exatamente onde eles estão em seu eixo Y bem aqui neste controlador de visão em particular. Então, se formos em frente e selecioná-los todos ao mesmo tempo, e então vamos até o botão para uma linha, o que podemos fazer aqui é marcar verticalmente no contêiner, mas não vá em frente e aperte ainda. Você verá aqui que o valor atual é definido como zero Agora, se ele estiver definido como zero, o que vai acontecer é que ele vai posicionar verticalmente tudo no centro morto porque isso vai ser o eixo zero aqui para esta visão. Controlador ligado. Não queremos fazer isso porque o que acontecerá se eu fizer isso? Nós não queremos isso. Isso é indesejável. Então, eu ia apertar o Comando Z ou apenas editar, , desfazer e vou mostrar o que precisamos adicionar para isso, então nós realmente queremos Dio é fazer o que fizemos de novo, mas tudo bem aqui. Marque verticalmente. Mas vá para este menu suspenso e use o valor atual da tela. Com esse ditado é, tome a posição branca para cada um desses que eu rótulos e que vai ser onde ele está posicionado verticalmente, então tinha adicionar as três restrições e você pode ver que eles ficam onde eles estão Agora todos nossos avisos desaparecem porque estão posicionados corretamente. Agora, aqui está o dia importante. Por isso, neste momento, ainda estamos a fazer isto é um iPhone 8. Digamos que descemos para o menor tamanho do dispositivo, que é o iPhone quatro s, e então vamos trabalhar. Olhe para o nosso título e vamos para o inspetor real aqui e adicionar um de nossos
títulos mais longos . E se você se lembra do título padrão para um, tínhamos estava planejando uma viagem para a Espanha. Agora, veja, isso é um problema. Nosso texto está sendo cortado porque o pensamento é muito grande para o dispositivo. Agora, se voltarmos a um iPhone 8
, não será problema. Temos propriedades suficientes para lidar com isso agora. Felizmente, há uma solução fácil para isso, e o que podemos fazer aqui é se você tiver o rótulo selecionado Enfraquecer, passar para o encolhimento automático aqui e ver como ele define um tamanho de fonte fixo. Podemos mudar isso para uma escala de pensamento mínima ou um tamanho mínimo de fonte, então eu vou selecionar o tamanho mínimo da fonte e você verá aqui que ele está definido para um
valor padrão de 16 e, de repente, nossa etiqueta agora cabe dentro de um iPhone para s. Agora, se voltarmos para um plus. Ele volta para o tamanho de fonte maior para 32. E se estiver tudo bem agora, digamos que
vamos até um iPad e dê uma olhada lá e você pode ver que ainda estamos usando o tamanho máximo que definimos como 32. E estamos no centro vertical na tela onde queríamos. Então poderíamos até aumentar esse tamanho divertido um pouco mais. Talvez, Ah, 35. E vamos voltar para o iPhone para S e você pode ver que ele ainda está dimensionando o pensamento apropriadamente para o tamanho do dispositivo, que é ótimo. Então agora estamos prontos para conectar os dois últimos rótulos para o tipo de tarefa na data de vencimento e antes de trocarmos os pontos de venda. Uma coisa que temos de nos certificar de que fazemos é voltar à nossa tarefa aqui. E se você se lembra, nós inicialmente tivemos que começar tudo isso privado para que nenhuma outra classe pudesse acessá-los. Isso não precisava de acesso a essas propriedades. Bem, agora precisamos de acesso a eles porque estamos ligando-os à interface. Então precisamos fazer é alterar a data de vencimento de privado para interno, que
possamos simplesmente excluir private e internal é o modificador de acesso padrão, e agora seremos capazes de acessá-lo para fazer essa ligação. Então, uma vez que você tenha feito isso, vamos voltar para o controlador de visão detalhada aqui e começar a criar nossos pontos de venda para os outros dois rótulos. Então eu vou Teoh, vá em frente e apenas controle. Clique sobre e ele vai ser o rótulo do tipo de tarefa, e eu também vou para parece que eu posso ter excluído essa conexão. Deixe-me colocar isso de volta para o título do teste aqui e, em seguida, também fazer para a data de vencimento. E agora temos todas essas conexões no lugar. Vamos em frente e criar uma nova função, interface de configuração de funk
privado, e o que podemos fazer aqui é em vez disso, se deixar tarefa é igual a tarefa, vamos apenas ir em frente e cortar isso. Para o momento. Vamos chamar a interface de usuário configurar na vista. Será que carga dentro do método vai colar que se deixar Jack aqui, ea razão que estamos fazendo isso Jack é porque tarefa é opcional. Queremos ter certeza de que realmente temos uma tarefa antes de começar a fazer qualquer tipo de operações que possam ser vinculativas, sem valores e causando uma falha de tipo de execução. Então agora que nós,
ah, ah, você sabe, rastreamos e desembrulhamos nossa tarefa
com sucesso, vamos em frente e realmente começar a conectá-la. Então, começando com o título, poderíamos fazer nível de título de tarefa. texto obtido é igual ao título do ponto da tarefa. Da mesma forma, podemos fazer o rótulo de tipo de tarefa que as pessoas de texto são o ponto de tipo de tarefa para todo valor trazido porque é um e newme. Esse é um tipo de string nos valores errados, a representação de string dessa enumeração. E, finalmente, para o rótulo da data de vencimento da tarefa. Vamos usar uma data para a matéria, porque se você se lembrar do ponto da tarefa eu vou ter que apertar comando para estar aqui porque precisamos compilar nessa mudança que fizemos para que a data seja interna. Então agora se eu fizer o ponto de tarefa você pode ver a data de vencimento aparece e é uma data de tipo, então não é um valor de string, então temos que convertê-lo para que façamos uma data para a matéria. Deixe data para a matéria é igual a uma data para a matéria, e vamos definir esse formato de data um formato para o mesmo formato que usamos a partir do
Criador de Tarefas de Entrada e colocar poucos controlador. Então isso foi um maiúsculo M m minúsculo D D D e minúsculo. Por quê? Porquê, porquê, porquê? E finalmente, o que podemos fazer aqui é a tarefa. Rótulo de data de vencimento, não texto é igual à data da string de matéria a partir da data. O dia vai passar é a data de vencimento do ponto da tarefa. Agora, antes de executarmos tudo, vamos consertar uma última coisa. O aviso aqui que o controle de visualização de detalhes e o storyboard tem um botão de volta azul, e ele realmente não se encaixa com o tema do nosso tipo preto em amarelo de estilo. Agora, se você se lembra, uh, se você se lembra, esta barra de navegação vem do controlador de navegação porque é herdada
porque está embutida nessa hierarquia. Então, uma solução rápida para isso é que podemos realmente definir uma tenda global na barra de navegação para realmente ser uma cor diferente. Então, se você ir e selecionar o seu controlador de navegação e você entrar aqui e selecionar a barra de
navegação que podemos fazer é ir para o inspetor de atributos da barra, ir para baixo sob palavra, diz vista aqui. Procurar tenda pretende definir para este azul aqui é um padrão, mas podemos mudar isso para uma cor diferente. Podemos mudá-lo para preto, por exemplo. E quando fizermos
isso, vai ser um botão preto de volta. Também antes de executá-lo. Vamos testar mais uma coisa no controlador de visualização de detalhes. Há uma propriedade chamada Title e se você ler aqui, é um local s durante que representa para a exibição que este controlador gerencia. Se configurarmos isso, vamos apenas dio-detalhe tarefa. Bem, na verdade, vendo a barra de navegação, o título real aparece aqui no centro para que possamos dar a isso Ah, um
pouco mais de, ah, informações sobre qual tela Estamos no ar. E queremos fazer uma última mudança. Voltar para a lista de fazer o controlador de vista de tabela e só para que possamos testar rapidamente isso , vamos em frente e un comentário, desconstruir método de fonte de dados apenas para colocar de volta as tarefas estáticas que tínhamos criado. E agora vamos em frente e executar esta pousada um iPhone SG, que é um tamanho de tela menor apenas para verificar se tudo está olhando e agindo como
esperávamos . O Teoh. Então vamos em frente e clique em um dos mais longos como planejamento Trip to Span e você pode ver aqui que estão de volta Botão é preto. A tarefa de título detalhado está aparecendo aqui no centro da nossa barra de navegação, e pudemos ver nossa viagem de planejamento de texto para a Espanha. Está parecendo bom. Não foi cortada. Vamos a esta outra vez. Parece muito bom. E agora vamos realmente tentar criar um. Então ligue para essa nova tarefa e eu ia me certificar de que meu teclado está alternado aqui. Vamos colocar isso no estudo na categoria. Não diga que isso é devido em alguns dias. Eu não o criei. E então aqui está nosso novo teste que foi colocado no fundo porque tínhamos nossas tarefas
definidas estaticamente carregadas aqui. Se entrarmos nessa nova tarefa de teste estudando e essa é a data de vencimento que tínhamos marcado. Então parece que tudo está funcionando como esperado,
21. Como adicionar os toques de polimento: agora na fase final do nosso tutorial, queremos fazer o nosso olhar um pouco melhor, particularmente no nosso para fazer lista controle de exibição tabela. Especificamente, queremos fazer três coisas. Queremos adicionar um título à parte superior da nossa barra de navegação. Queremos tornar essas células um pouco menores verticalmente, e quando não temos células em nossa exibição de tabela ou uma lista vazia, queremos ter uma visão de fundo que exiba um rótulo indicando que precisamos adicionar alguns dados à nossa tabela. Então vamos começar primeiro com o fundo de você em nossa exibição de tabela, e o que vamos fazer é criar um rótulo, mas não vamos criar um rótulo no storyboard. Vamos fazer isso programaticamente. Então, a primeira coisa que vamos fazer é ir para a tabela lista de fazer de você controlador e comentar nosso método de fonte de dados de construção aqui, e vamos em frente e dar uma olhada no que temos agora quando temos nossa fonte de dados comenta para fora, e por isso temos apenas uma visão branca. Nós realmente não temos nada aqui que indique que temos uma lista vazia. Simplesmente não vemos nada. Apareça. Então agora vamos em frente e dar uma olhada em uma propriedade muito interessante na vista da tabela U
I. Então o que vou fazer aqui são apenas comandos. Clique em qualquer uma das tabelas U I de uso. Eu confinado e salto para definição e dentro da vista de mesa. Estou procurando uma propriedade chamada background Byuk, e se lermos a documentação aqui, é um opcional que você tem você e o fundo você será redimensionado automaticamente para rastrear o tamanho da exibição de tabela. Isso será colocado como uma visão sub da exibição de tabela atrás de todas as células e cabeçalhos e rodapés, e isso é exatamente o que vamos usar. Vamos criar um rótulo programaticamente, que deriva de você,
eu vejo, e vamos definir esse rótulo como a visão de fundo para nossa exibição de tabela. Então vamos voltar para o novo controlador e começar a implementar isso. Agora vamos em frente e implementar uma nova função aqui então vamos em frente e criando função chamada display funk privado, mensagem de exibição de tabela
vazia. Eu estava realmente só tem exibindo a exibição da tabela vai dizer que o parâmetro é a mensagem porque isso é um pouco mais claro em nosso método nomeação aqui. Assim que fizermos isso, vamos passar uma mensagem. Vamos criar um rótulo
e, em seguida, vamos definir isso para as vistas de tabela, vista fundo. Então, começar criará um rótulo como este. Vamos esvaziar, uh, deixar final info label é igual au I label se você se lembrar de você, I label é o que nós arrastaríamos do storyboard para um de nossos controladores de visualização no Construtor de
interface. Então, basicamente, tudo o que estamos fazendo é criar um desses programaticamente. E se você ver aqui, esta pequena caixa, o retângulo, os cantos, isso é o que é conhecido como a caixa delimitadora, também referida como o salto, hum, ou o quadro. E assim, essencialmente, isso é o que um rótulo consiste, ou qualquer você que eu vejo como elemento. É algum tipo de controle com a posição de uma caixa. Ele x y coordena dentro da altura. E então quando criamos um rótulo, se você vê aqui, nós temos alguns inicializadores nós temos um u eu rótulo apenas vazio rótulo Brett, e então nós temos um com um quadro e um com um codificador. Então, já que não vamos fazer nenhum tipo de arquivamento de dados, não
vamos usar o método codificador. Normalmente, poderíamos usar o método frame. E quando dizemos disse um quadro, estamos realmente dizendo que eu quero definir um X e A Y dentro da altura. Então, por exemplo, se eu dissesse que eu quero que isso seja 100 X, talvez 100 por quê e 200 dentro de 50 e altura, Bem, eu poderia equivalentemente voltar para o storyboard, e eu poderia dar uma olhada aqui, e eu poderia realmente definir aqueles ao redor manipulando o X e Y dentro da altura para ver visualmente como isso pode ser parecido. E eu poderia fazer exatamente a mesma coisa em código usando o cerco que você ergueu. Eu rotulo inicializado com o quadro bem aqui, mas o bom é
que, nós nem sequer precisamos passar por descobrir fora do quadro porque assim como a documentação , disse a visão de fundo da tabela, você irá dimensionar automaticamente o que você vive você ou o rótulo ou o controle para caber dentro
da vista de fundo, que
possamos simplesmente criar um rótulo U I como este. Agora vamos em frente e criar a atribuição para que nós vamos fazer uma tabela de você ponto Visualização de fundo é igual ao nível de informações e ali mesmo nós fomos em frente e fizemos a atribuição, mas ainda não terminamos. Precisamos ir em frente, definir o texto e configurar nosso rótulo. Então, o que podemos fazer aqui, ao lado de definir o texto, acho que o rótulo não texto é igual à mensagem. Então, bem ali. Até agora,
tudo bem. Agora precisamos definir mais algumas coisas. Queremos que o texto seja centrado. Não queremos que seja justificado, uma direita justificada. Então o que podemos fazer aqui é procurar informações, alinhamento de texto de ponto de
rótulo, e podemos definir isso igual ao centro de pontos. Além disso, queremos definir o número de linhas para zero porque se tivermos uma mensagem muito longa, queremos não recortar nosso rótulo. Hum, para uma linha, nós queríamos derramar em várias linhas,
então, definindo-o como zero, ele vai permitir apenas nessa situação para ele tantas linhas quanto as mensagens compridas. Agora vamos em frente e definir o pensamento para que possamos fazer aqui é no rótulo info. Tem uma propriedade chamada font eso. É au I font e nós podemos criar que programaticamente Assim como nós iria definir um
construtor de interface como este Você eu achei que vamos usar o nome Isar inicial e tamanho então nós estávamos usando eu acho Helvetica novo e eu acho que no rótulo maior nesta tabela células foi ousado para que pudéssemos tentar isso aqui e ver como isso se parece. Ele vai dizer que pode ser para um tamanho fora 20. Só assim é grande e se destaca. Sabe, aquele carrapato, uh, soletrou errado? Parece certo. Nossa função aqui parece muito boa, mas ainda precisamos descobrir onde chamamos isso? Agora, há um par de possibilidades aqui, mas uma possibilidade realmente interessante, pelo
menos neste exemplo, porque só temos uma seção de nossa exibição de tabela está em nosso número de linhas e seção. Hum e assim uma seção pode constituir como, ah agrupamento de dados e você pode ter mais de um agora se tivéssemos mais de uma seção em nossa visão de tabela. Podemos ter diferentes tipos de dados em vez de apenas uma matriz de um tipo específico. Agora, o que precisamos estar atentos é que temos que sempre verificar. Bem, quando queremos mostrar esta tabela da sua mensagem? Bem, realmente, queremos exibi-lo sempre que a visualização da tabela estiver vazia. Como saberemos se a nossa vista de tabela está vazia? Bem, nossa fonte de dados provavelmente será zero para a contagem, e isso é exatamente o que podemos fazer. Então, se entrarmos em número de linhas na seção aqui e dizer se fonte de dados que contagem é igual zero ou uma visão de tabela vazia, em
seguida, vá em frente e exibir a mensagem de exibição de tabela vazia. E o que podemos dizer é algumas para fazer tarefas. E então, supondo que a fonte de dados que contagem é maior do que zero nesta instância, a exibição de plano de fundo da tabela que dissemos saber para que não tenha o rótulo. Ele saberá como ele não terá uma visão associada a ele. Na verdade, renderizará os dados. Então, a qualquer momento, adicionamos ou removemos elementos e basicamente recarregamos a fonte de dados. Este método será chamado e, em seguida, vamos fazer a verificação aqui. E, em seguida, se não temos nada na vista de tabela, irá exibir nossa mensagem. Se tivermos coisas, removeremos nossa mensagem de exibição. Agora vamos testar isto e ver como é. Então aqui está o que parece e parece bem. Podemos fazer um pouco melhor porque esse ousado realmente se destaca. O embarque pode não ser o melhor. Então vamos voltar para o controlador de visão aqui em vez de ousado para essa diversão. Vamos usar uma luz leve, uh, tamanho em vez de fazer, vamos apenas tentar, criar algumas tarefas. Vamos executar isso mais uma vez com essas mudanças e ver se isso parece um pouco melhor do tipo você aux perspectiva. E eu acho que isso parece muito, muito melhor. Então temos esse conjunto. Estamos prontos para ir. Ah, e agora vamos em frente e tentar adicionar um título à barra de navegação, e podemos simplesmente fazer isso se você lembrar de como fizemos isso em detalhes. Exibir Controlador é entrevistado Carregar. Poderíamos ir em frente e definir essa propriedade title no controlador View para um valor de string. Neste caso, pode fazer sentido apenas dio para fazer lista. Simples assim. E agora vamos em frente e executar isso e ver como ele se parece com a lista a fazer definida para o título. Parece OK e agora para uma mudança final, O que vamos fazer é ir em frente e incomum o método de fonte de dados de construção só porque enfraquecer rapidamente, dar uma olhada em tudo aqui e vamos ver se podemos nos tornar um pouco menores para diminuir o espaçamento vertical que temos entre eles aqui. Então vamos voltar para o storyboard principal e dar uma olhada na subclasse de célula que temos no controlador de exibição de tabela lista e quando vamos em frente e selecionar nossa célula aqui e vamos dar uma olhada no, uh, tamanho real dele aqui, então nós definimos isso para uma altura de 145 Agora, inicialmente, parece meio que ok, mas como nós começamos a desenvolver isso ainda mais, parecia que ele pode ser apenas um pouco alto demais para apenas o quão simples nosso estruturas de dados são. Então, se quisermos uma diminuição que se esconda verticalmente, teremos que mover algumas coisas. Começando, podemos pegar nosso rótulo de legendas aqui e subir um pouco, apenas ligeiramente até a parte inferior da etiqueta do título. E lembre-se que estes avisos Ah laranja aqui estão dizendo que nossas restrições ainda estão aqui. Mas nós movemos nosso quadro para aqui, então precisamos ir em frente e atualizar o quadro, o
que, em seguida, colocá-lo de volta aqui, que nós não queremos fazê-lo ou atualizar as restrições para posicioná-lo onde o novo quadro é Isso agora mesmo. Então, com o rótulo selecionado Enfraquecer, vá aqui para resolver problemas de layout automático e simplesmente tinha atualização, constantes de
restrição, e eu vou em frente e cuidar disso para nós. Agora, se voltarmos para a altura da linha, vamos começar a diminuir isso um pouco de cada vez. Tente conseguir algo que pareça bem agora. Parece que nossos rótulos estão ficando um pouco esmagados lá. Está tudo bem. Vamos abaixar para 120 e então vamos pegar o rótulo mais uma vez,
trazê-lo de volta,
meio que trazê-lo de volta, para a borda aqui, e acho que poderíamos fazer um pouco melhor. Vamos ir em frente e pegar essa venda e descer para 15 e ver como isso parece. Vamos pegar que algum título, capaz novamente destruído e movê-lo com o layout para fora. As diretrizes estão nos alinhando, Doc, e atualizaremos as restrições da mesma forma que fizemos. E vamos ver o quão longe este rótulo está do rótulo de título, então vamos selecioná-lo. Vamos até aqui para este botão e receber que foram exatamente para longe da próxima gravadora. Então, isso é muito perto. Quase tocando-o. Isso é bom. Então isso ficará melhor visualmente do que o que tínhamos antes. Lembre-se aqui, mesmo que nós atualizamos esta altura de linha para 1 15 nós também precisamos ir em frente e fazê-lo no controlador de
visão porque ele está retornando uma altura de linha de 1 45 porque nós não atualizamos isso , e isso irá substituir este 15 aqui e fazer a nossa tabela de vendas parecer ruim de uma perspectiva
visual. Então, se voltarmos para o para fazer lista tabela de exibição controlador. A mudança final será transformar este 145 em 1 15 Agora vamos em frente e executar isto no simulador e ver como é. Isso parece muito melhor, muito menos desperdício no espaço. E vamos em frente e comentários para fora são construídos método de fonte de dados aqui e criar uma tarefa do início ao fim com todas as nossas alterações aqui e C são concluídos aplicativo. Então Grayson tarefas terminar o revestimento do projeto e disse isso para amanhã. Sim, bom, ótimo. Olhe para isso. Parece muito bom. Temos tudo acertado como queremos, e parece muito melhor do que o que tínhamos antes.