Divertido com arte generativa: cores e textura

1. Vídeo de introdução de cores e textura: Olá pessoal, Meu nome é atingido em você e isso é cor e textura genitivas. Quando aprendi arte generativa pela primeira vez, eu estava sobre a lua pelas possibilidades de criações processuais. Mas somente quando comecei a pressionar por ideias prontas para uso foi quando comecei a desenvolver um estilo. Sempre que aprendi nova técnica, volto a esboços antigos e os implemento, descobrindo como amalgamar os dois projetos. Neste curso, discutiremos como você pode fornecer profundidade e semi-realismo em seu trabalho com métodos de texturização e coloração fáceis de implementar. Eu poderia oito lições diferentes sobre maneiras tentar texto e colorir seu design generativo. E um projeto final mostrando a combinação de vários procedimentos em uma obra final. Em quatro das lições, examinaremos quatro maneiras de adicionar textura ao seu trabalho, desde se assemelhar a formas desenhadas à mão até adicionar sombras suspensas gráficas simples. E, finalmente, não é uma paleta de cores com desconto e perfeitamente aleatória. Mas neste curso, mostrarei técnicas de coloração que elevarão seu trabalho para o próximo nível, criaremos uma obra de arte completa do zero para cada método, demonstrando como eu pensei em empregá-los e dar-lhe ideias de aplicativos. Acho que isso é suficiente para uma introdução. Então, vamos começar. 2. Textura 01: as círculos para recreação: Nas duas primeiras lições para textura número um, eu queria falar sobre recriar as formas primitivas são as formas nativas em processamento, como círculos e retângulos, especificamente círculos e retângulos. Então, nesta primeira lição, falaremos sobre círculos e, na próxima lição, falaremos sobre recriar retângulos. Então, para este, vamos criar uma nova classe, e essa classe será o círculo. Então, para começar, vamos apenas fazer, vamos nomeá-lo blob. Agora, nesta classe, definiremos todas as propriedades que precisaremos para criar um círculo usando pontos. Se você pensar sobre isso, um círculo tem um ponto central e depois tem um raio. E mais tarde, os pontos que criarão o perímetro do círculo. Então, para os pontos que criam o perímetro, isso será um conjunto de carros alegóricos que serão posições de x e y. E então também precisamos da resolução para saber a quantidade de pontos que precisamos para criar esse círculo. Para isso, vou apenas criar um número inteiro e vou chamá-lo de Raz para resolução. E também vamos precisar do centro x e do centro y para o centro do círculo. E então também dissemos que vamos precisar de um raio. Então, não vamos esquecer isso. Certo, e para começar, vamos criar reservatório aqui. E vou inicializar essas variáveis são essas propriedades no construtor. Então eu vou fazer e vermelhos. E então eu também quero definir o eixo central e o porquê Central mais tarde. Então, não vou encontrá-los aqui. O centro x será igual a este centro x e, em seguida, centralizar o mesmo. E agora vamos inicializar x e y. Esses serão de vermelho de comprimento. Porque x e y, vou ser apenas as posições e a quantidade delas será a resolução desse círculo. E para o raio, vou começar com valores aleatórios. Eu vou ficar com valores aleatórios, na verdade. Mostre-me que vai ser de 10 a 50 lá flutuadores antes de começar a criar ou exibir o círculo usando os pontos x e y, tenho que inicializar os valores para x e y. Então vou criar uma função init. E nesta função vai ter um loop. E isso, claro, vai ser menor que a resolução. E então vamos incrementar em um normalmente. Agora aqui vamos criar os pontos. Se você visitou meu Instagram ou YouTube , teria visto como criar pontos ao redor do círculo. Ou se você fez meu curso Polar Grid. Mas geralmente vamos criar esses pontos ao redor do círculo girando usando cosseno e seno. Então, vamos usar essas funções para, desenhar os pontos ao redor do círculo usando os ângulos dos pontos dentro desse círculo. À medida que passarmos por isso, você será capaz de entender como isso funciona. Então, para o primeiro, será o sotaque que eu posiciono. E para isso, vamos usar cosseno o ângulo. E vamos criar o ângulo em um pouco. E então vamos multiplicá-lo pelo raio. Estamos basicamente criando pontos em triângulos e depois girando com base no ângulo desses triângulos e isso criará o círculo. É por isso que a resolução é importante aqui. Como quanto maior a resolução, mais circular o blob ficará, e quanto menos esses pontos estiverem onde, menor o valor da resolução, então você começará a ver mais de um forma hexagonal ou forma de diamante ou até mesmo um triângulo se você descer para três. E isso está girando com valores de menos um para um porque cosseno do ângulo, qualquer ângulo que me dê valores de menos um para um. Então eu preciso multiplicá-lo pelo raio para empurrá-lo para fora com base em quão grande eu quero que o círculo seja. Então, neste momento, quero que o círculo seja aleatório, um raio aleatório de 10 a 50. Portanto, a largura ou o diâmetro desse círculo será de 20 a 100. E então, para você, vamos fazer seno. O ângulo. Multiplicado pelo raio. E então, para empurrá-lo para o centro, vamos ter, porque isso vai desenhar em torno do ponto zero zero. Então, vamos ter que empurrá-lo pelo centro x e no centro y. Então, seja lá o que eu definir, é aí que o centro do círculo estará no final. E então o ângulo será definido dentro do, dentro do loop for. E vai ser I. Então, cada ponto multiplicado pelo ângulo de cada um desses retângulos dentro do círculo. Então, digamos que eu tenha seis pontos para resolução. Então esse loop irá iterar seis vezes, o que significa que a IA será multiplicada por 16 ordens para completar o ângulo 360. Mas, inicialmente, não sabemos qual será a resolução, então não sabemos qual ângulo colocar aqui. Então, para o ângulo, vou chamá-lo de fatia. E então eu vou calcular isso aqui em cima. E vou chamá-lo de fatia e vou defini-lo aqui em cima. Vou apenas adicioná-lo ao raio. Portanto, não temos muitas propriedades umas sobre as outras. E aqui vou dividir 360 pela resolução. 360 é a soma dos ângulos em um círculo e, em seguida, dividi-lo pela resolução vai me dar o ângulo de cada espaço que esse ponto vai tomar. E então eu tenho que converter isso em radianos porque cosseno e seno precisam de radianos para funcionar. E agora é hora da parte divertida que está exibindo e vendo que o que criamos funciona. Agora, para desenhar o círculo, vamos precisar percorrer os flutuadores X e Y. Então, vou passar pelo mesmo processo que fizemos na função init. Vamos usar co-vértices. A razão pela qual estou usando vértices curvos em vez vértices é porque eles são mais suaves. Então, o vértice curvo leva dois valores como um vértice. E então eu vou dar x e y e eu também. O que você precisa saber sobre a função de vértice atual é que ela precisa de funções de vértice atuais para aparecer, porque o primeiro será o ponto de controle para o primeiro, e então o segundo será o primeiro da curva. O terceiro será o segundo da curva. E então o último ponto, que é o quarto, será o segundo ponto de controle. Então, basicamente, uma curva de Bézier, mas é criada usando uma função de vértice curvo, então cada ponto é desenhado separadamente. Agora esta vai cuidar de parte de seus vértices curvos, pontos de controle e pontos. Mas se eu mostrar isso, não teremos um círculo completo. Temos que ver isso primeiro antes de resolvermos o problema. Então, se eu for aqui e criar um blob e depois inicializar um objeto. Vamos precisar de uma resolução. Então, vou fazer seis porque isso é o mais fácil de calcular. E então farei a largura dividida por dois para o centro e a altura dividida por 2 para a central y. Em vez de chamar dois métodos aqui, vou chamar uma rede aqui. Só assim toda vez que inicializamos um objeto, ele já é inicializado. E então vou mostrar este aqui. E precisamos começar a forma e essa forma para qualquer vértice basicamente. E nós o colocamos fora do loop for porque queremos começar a forma e depois desenhar todos os vértices de que precisamos e depois terminar as formas. Então, tudo isso será conectado porque se você colocar a forma Begin dentro daqui, dentro do loop for e da entrada também. Então toda vez que ele começará uma nova forma para cada iteração. Certo, então vou começar com um raio de 100. Eu não vou começar com aleatoriedade, então você pode vê-lo claramente. Então você pode ver que só temos 1234 pontos sorteados. Temos mais dois para desenhar. Então cinco está aqui, e seis estão aqui. Ou, na verdade, é 1, 2, 3, 4, 5 e, finalmente, 6. Então, vamos soltar pontos. Então, somos capazes de vê-lo. Vou desenhá-lo usando círculos e ele estará na mesma posição. E então eu darei uma largura de 20. Então você pode vê-lo claramente. E vamos realmente remover o preenchimento. Como isso está funcionando e por que não temos todas as curvas é porque o for-loop cuida do primeiro ponto de controle para a primeira curva. Então, o ponto número 0 atuou como o primeiro ponto de controle. E então este será o primeiro na curva. E então este será o segundo na curva, e esse será seu ponto de controle. Agora, olhando para o segundo, este será um ponto de controle para essa partida, para essa curva inicial. E então este é o fim da curva e esses são seus pontos de controle. E vamos dar voltas e voltas. Então, se você for para essa parte, então não há curva aqui porque isso funcionou como o ponto de controle e este é o último ponto. O que precisamos fazer agora para corrigir isso como adicionar mais três pontos. Então, o primeiro será antes do loop. E esse será o último ponto. Então resolução menos 1. E então para y também o último ponto. E agora, se eu executar isso, você pode ver que temos um ponto de controle para essa curva agora, que é essa parte. E porque é desenhado antes do primeiro, agora ele entende que isso também é uma curva e precisamos de outra depois. Isso será a saída 0 e y em 0. Porque depois desse último ponto, preciso que isso exista para que essa curva seja desenhada. Então agora este é um ponto de controle para essa curva. E agora eu tenho uma curva final para desenhar, que é esta. Então, enquanto o ponto de controle para isso, será esse. Então, este é o número um. E se eu desenhar esse vértice de curva em x, ou não necessariamente o número um, mas na posição 1 na matriz. Agora, se eu executar isso, está completo. Então eu vou ficar, digamos que com a aids porque isso é bom. Circule isso não, você não vê mais muitos dos pontos. Agora este é um bom ponto para animarmos isso. Uma das razões pelas quais eu queria recriar um círculo em primeiro lugar é ter um pouco de variação. E para fazer isso, é extremamente simples. Tudo o que você precisa fazer é apenas criar um método de atualização dentro da sua classe e, em seguida, criar uma variável. Você pode chamá-lo de qualquer coisa. Mas esse será o nosso deslocamento. E também vamos fazer loop. E estamos entrando em cada um dos pontos para movê-lo. Então, para o primeiro, será x na posição I mais igual a um valor aleatório de menos deslocamento para deslocamento. E o mesmo vale para y. Então estamos incrementando o que quer que sejam por um valor aleatório. Então, ele vai se mover até começar a distorcer o círculo. E eu senti ir até aqui e faço, bem, eu tenho que movê-lo para a função de desenho. Agora posso começar a vê-lo se movendo. Então, primeiro temos que redefinir o plano de fundo. Então, ele não desenha. E você pode aumentar isso até o valor que quiser para as compensações. Quanto mais alto for, mais rápido ele será distorcido e você não voltará ao círculo. Então, um valor baixo como 0,5 manterá essa forma de círculo por um longo tempo, mas ainda nos permite ter variações no perímetro do círculo. E você também não pode animar, mas simplesmente compensar os valores aqui ou quando você inicializá-lo. Não, Para este exemplo, esta primeira seção é sobre criar ou recriar o círculo. Mas, na segunda parte, quando falei sobre criar o exemplo, vamos falar um pouco mais sobre detecção de colisão. Portanto, a detecção de glúten é muito fácil de entender. É simplesmente, especialmente para círculos. É simplesmente encontrar a distância entre o centro de dois círculos adjacentes ou no mesmo espaço. E vendo se essa distância entre os dois centros é menor que a soma dos olhos dos dois raios. Então, se houver menos do que a soma dos dois raios, isso significa que eles estão se cruzando, o que significa que eles estão colidindo. Então, queremos evitar isso. A maneira como você pode verificar se dois círculos estão se cruzando é. Usando a função dist, que basicamente obtém a distância entre dois pontos. Então, vamos realmente criar isso aqui. Vou criar um método dentro da nossa classe blob chamado collide. E esse método vai tomar porque está verificando a distância entre si e outro objeto da mesma classe, então precisamos passar em um blob também. Portanto, isso é uma coisa legal que você pode fazer dentro das classes onde você pode permitir que o objeto da classe atual que você está usando interaja com outra classe ou um objeto de outra classe. Mas aqui só precisamos que ele interaja consigo mesmo ou com objetos da mesma classe. Portanto, não precisamos criar várias classes disso porque já temos a classe em si. E a maneira como podemos usar isso é assim. Então, se eu flutuar e eu chamá-lo de d, isso vai levar o centro x e o centro y deste agora. Então podemos chamá-lo de CX e CY. E então ele vai verificar a distância desse círculo. Então o x e y deste círculo dois e x e y do outro círculo que estamos passando aqui. Assim, podemos simplesmente fazer outro ponto c, dx, e podemos pegar qualquer coisa que esse objeto tenha de propriedades. Então podemos fazer ponto cx e, em seguida, outro ponto ver Y. E então, se d for menor que a soma dos dois raios, isso significa o raio que temos agora, que é R mais outro ponto r. E então, se isso acontecer, então vou voltar a verdade. Isso significa colidir. Então, o que eu preciso mudar aqui é o valor de retorno porque agora ele não está retornando nada, na verdade está retornando um valor booleano. E então, de outra forma, ou se isso não sair do que eu precisava retornar false. E não precisamos de uma declaração else aqui porque o retorno meio que sai da função. Ele retorna a função. Você não alcançará mais essa parte. E agora, se eu for aqui, removerei o blob que criei, e então farei isso em uma ArrayList. E compartilharei com você por que estou criando uma ArrayList em vez de uma matriz. Então, vou chamá-lo de blobs. Vou inicializá-lo aqui. Então, vou fazer uma nova ArrayList do tipo blob. E agora aqui embaixo. E é por isso que estou usando ArrayLists. Eu posso apenas adicionar blobs sem saber quantos eu preciso. Então eu posso simplesmente fazer blogs, pontuar, adicionar, novo blob. E vou fazer dela uma resolução seis por enquanto. E então eu vou tê-lo em largura aleatória e altura aleatória para o centro x e o centro y. E agora exibir cada vínculo vai fazer quatro pol. Então, para blob, blob, blobs, são muitos blogs e exibi-lo. Então agora ele vai apenas adicioná-los porque ainda não detectamos colisão. Para detectar colisão, podemos simplesmente usar um loop for para percorrer todos os blogs existentes contra o novo adicionado. Como posso fazer isso é criando um loop normal que vai do tamanho de 02 blobs menos um porque não quero alcançar o último. O último é o quê? Vou verificar contra os outros na matriz. E então vou incrementar. E aqui direi, criarei o índice para o último bloco que foi criado dentro dessa matriz. Então, esse será o tamanho do ponto de blobs menos um. Então, isso vai ser menos do que este último. E este será o último. E agora vou verificar o blog na posição j contra o outro bloco. Então, o olho de gato de ponto de Bob. Então, se o blob na posição j, que é o último adicionado, está colidindo com qualquer um dos que existem na matriz agora que não são o último, é claro, então eu preciso que você remova esse blob. Agora, cada vez que isso estiver adicionando um blob, ele verificará se ele colide com algum dos existentes e, em seguida, ele irá removê-lo para que ele não exista mais. E então ele vai fazer um loop e fazer isso repetidas vezes. E agora você pode ver que nada realmente colide. Se eu agora retornar à classe e mudar isso para aleatório de 10 para 50. E é por isso que eu uso um número menor porque eles têm uma tela muito pequena. E agora temos um monte de círculos que não colidem. Se eu remover isso, que são os guias, então eu posso ver que eles não colidem. A única vez que eles vão colidir como quando estão distorcendo. Podemos reduzir a velocidade para isso porque agora eles são menores, então é mais aparente. Então você pode simplesmente reduzir a velocidade e agora você não os vê se movendo tanto. Agora você pode apenas colori-los aleatoriamente. Vou pegar um monte de cores que tenho. Ele pode escolher as cores que você quiser. E também escolhi uma cor para o plano de fundo. Então, vou usar isso aqui. E aqui. Se você está redefinindo por aqui, você não precisa deste. A única razão pela qual eu o uso aqui é porque toda vez que isso é R1, você pode vislumbrar o plano de fundo que está aqui. Então, se você tiver um fundo preto, poderá vislumbrá-lo no começo. Não importa, mas se você estiver salvando cada quadro, então você vai vê-lo. E então eu tenho minhas cores aqui. Posso simplesmente definir a cor aqui e, em seguida, colorir todos os desenhos aleatoriamente a partir da matriz de carvões. E então o índice será aleatório de 0 para o comprimento do ponto de cores. E a razão pela qual eu vou subir duas cores nesse comprimento é porque vou lançá-lo em um número inteiro, já que não podemos ter flutuação para índices. E então isso vai acabar com ele. Então, seja qual for esse número será menos um. E agora vou até aqui e o método de exibição, farei a cor de preenchimento e você verá as cores aleatórias. Você também pode remover o traçado, se quiser, ou você pode deixar o traçado branco. Eles também darão uma aparência diferente. Na próxima lição, falaremos sobre recriar. retângulos são uma das maneiras pelas quais você pode recriar retângulos. 3. Textura 01: recreação quadres: Nesta lição, vamos criar um monte de retângulos usando o que parece ser linhas desenhadas à mão. Em vez de usar a função nativa no processamento para começar a entender como as linhas dos retângulos são criadas. Então vamos precisar começar com essas linhas. Primeiro. Vou criar apenas uma função normal. E aqui antes de criarmos qualquer classe para esse novo objeto, e eu vou chamá-lo de onda. Isso, bem como a garantia, use um vértice curvo para criar esse movimento fluindo. Porque os vértices tendem a ser muito Angulares e também precisaremos de um loop for-loop porque vamos desenhar, porque os co-vértices são basicamente pontos e vamos precisar de vários pontos para desenhar uma linha. Então, em vez de usar a função de linha, estamos usando pontos para desenhar a linha que vamos usar para desenhar retângulos. Para isso, também precisaremos ter uma resolução e também precisaremos ter uma posição x e y. Então agora, se eu chamar onda aqui, posso usar uma resolução de seis, digamos. E então eu posso iniciá-lo em 0 para x e, em seguida, para y, ele estará em altura dividido por dois, então no centro, verticalmente. E, na verdade, vamos começar a resolução aqui porque vamos usá-la várias vezes também. E então uma onda também precisará de uma largura ou uma linha de pontos também precisará de uma largura. Então, vou criar uma largura aqui em cima, ou um valor para a largura. E depois, quando formos verticalmente, vamos com altura também. Mas, por enquanto, só vamos desenhar uma linha horizontalmente na tela para que possamos ver como isso está realmente funcionando. Então, vou apenas definir com um v aqui. Então, vamos torná-lo a largura da tela. E então também vamos precisar de uma lacuna. A razão pela qual vamos precisar da lacuna, porque temos pontos, mas precisamos saber até que ponto eles estarão para desenhar a linha ao longo da largura, embora solicitemos. Então, primeiro, desenhe a partir de 0,02 de largura, vamos precisar saber o quanto o espaçamento será entre cada um dos pontos e que podemos encontrar. Então, se eu apenas definir a lacuna que vamos encontrar dividindo a largura pela resolução. Então, seja qual for a largura, se eu dividi-la pelo número de pontos que tenho, então recebo a quantidade de lacunas para espaçar os pontos. Basicamente, como desenhar uma grade. Então, quando você desenha a grade, você quer saber quanto será a largura de cada célula. Para saber quanto movimento você precisará ir para a direita ou para baixo para criar essas células na grade. Então, estamos fazendo a mesma coisa, mas vamos fazer isso com apenas uma linha. Então, começar a forma e depois terminar a forma porque estamos usando vértices curvos. E depois vou fazer um loop. E então aqui ele vai ser vértice curvo exatamente o que fazemos com grades. Então vou fazer, multiplico-o pela lacuna, que geralmente é a largura da célula. Então, exatamente como uma célula em uma grade ou como você desenharia grades. Mas precisamos adicionar x a ele porque x nem sempre estará em 0 como uma grade, vamos movê-lo pela tela. Então, exatamente como fizemos com Cx e CY para o círculo. Mas desta vez vai estar em uma linha. E então aqui será só por quê? Porque estamos apenas movendo-o na linha horizontal. Agora, se eu desenhar, eu tenho a linha. Mas, como você percebe, é exatamente como o que fizemos com círculos. Este está faltando pontos de controle e , portanto, não está desenhando o vértice da curva aqui. Então, para desenhá-lo a partir do ponto zero, terei que adicionar um vértice atual antes dele para atuar como seu ponto de controle. E isso vai ser uma lacuna mais x. Não precisamos multiplicar por eu porque será o primeiro. E então, para Y, vamos fazer um y por enquanto. Então agora temos um ponto começando aqui. E para nós vermos isso também desenhará um círculo como fizemos antes. E vou colocá-lo na mesma posição. E então vou fazer 10. Então você vê os pontos. Vemos que temos moedas em todos os lugares que precisamos. E então, para nós desenharmos o último ponto também. Porque só temos as lacunas. E em uma grade geralmente você está apenas desenhando do canto e, em seguida o retângulo ou a célula vai nos desenhar, e este último vai secar também. Mas aqui não temos um retângulo, só precisamos de pontos. Então, também vou dizer que sou menor ou igual, levante. Bem, vou ter um ponto no final também. E então, para desenhar aquele no final que vou dizer vértice atual no Rey's, que é o último multiplicado pela lacuna. E então isso vai ser y. E agora temos isso também. Ah, e não se esqueça de adicionar o x porque agora estamos apenas desenhando de 0, então não importa, mas depois isso vai importar. Então agora, se eu ajustar a largura, então vamos fazer um 100 e executar isso. Então podemos ver que está aqui. E se eu mudar a posição x para largura dividida por dois, agora, podemos ver que ela está se movendo porque agora adicionamos x a cada uma delas. Portanto, estamos nos certificando de que tudo está se movendo com o X que precisamos dele. Então, além de onde o eixo, isso vai acontecer. E agora é, você o torna mais interessante. E para fazer a forma da onda, vamos encontrar em offset aleatório cada um desses pontos. Vou fazer isso pelo y por enquanto. E isso será um valor aleatório. Vou chamá-lo de deslocamento V. Na verdade, ele mudou para deslocamento Y. E então aqui vou fazer a carga duas vezes deslocada, e vamos dar a ela um valor de quatro. Então, aleatório vai de 0 para qualquer valor para quatro. E eu não recomendaria copiar e colar, mas vou copiar e colar, tornar este vídeo mais curto. E, na verdade, alguns dos círculos, não precisamos mais deles. Agora, toda vez que eu executar isso, você verá que parece mais uma onda. Então, vamos realmente fazer isso maior. Vamos torná-lo uma largura, e vamos começar a partir de 0 para que você possa vê-lo mais claro. E porque só temos uma resolução de seis, os pontos estão espaçados demais. Então, se eu fizer isso, digamos 16, apenas adicionando um, podemos vê-lo mais curvilíneo. E então, se eu aumentar o deslocamento para dizer 10, e você pode ver mais curvas em nossa linha. Agora podemos usar essa linha para criar nossos retângulos. E assim vai parecer mais desenhado à mão, mas com um deslocamento de inquilinos demais. Então, vou reduzi-lo para quatro. E então também reduzirei a resolução para algo como seis porque quanto mais espaçado, mais se assemelha a uma sensação desenhada à mão. Porque sempre que você está desenhando, não faz sentido que estejamos todos muito instáveis e estamos desenhando com os deslocamentos Tumaini. Mas, geralmente, a maneira como desenhamos é fazendo um movimento fluido. Portanto, nem sempre parece muito instável como antes. Agora, para criar um retângulo, vou, em vez de ter apenas largura, ter largura e altura. E então também terei x gap. E por que lacuna. E para isso, será x gap. E então, para o outro, será dividido por Rey, que é a altura dividida por raça. E então as alturas, vou fazer com que a altura seja dividida por dois. E para a largura eu vou fazer isso também com dividido por dois para que possamos vê-lo porque se eu fizer a tela inteira, então você verá apenas parte da linha. E agora vamos corrigir essa função adicionando as lacunas aqui. X gap e, em seguida, por que lacuna. E, finalmente, vamos ter x offset e yoffset. Você pode ter o mesmo deslocamento para todos eles, mas vou tê-los diferentes porque então você pode jogar com eles mais tarde. E também você pode apenas limpá-lo. E assim você pode ver todos os parâmetros. Você pode simplesmente clicar em Enter. E então, se você fizer o Comando T, ele o formata para você. Então agora ele tem o mesmo recuo que o outro. E agora podemos consertar isso para torná-lo x cap para todos esses. E então, em vez de apenas y , y gap mais y , e aqui também, vai ser eu multiplicado por y mais y. E o mesmo vale para este, mas este vai ser eras, multiplique-o por y gap mais y. E então podemos adicionar o deslocamento, cada um deles. Então, vou fazer mais offset X aleatório. E aqui mais offset Y aleatório. Você também pode fazer a mesma coisa aqui. E o último. Agora eu sei que criamos o mesmo para x e y. Então estamos movendo tipo de diagonal que você está agora. Mas não vamos usar essa função de onda horizontal e verticalmente ao mesmo tempo. Vamos usá-lo para algumas linhas verticais e linhas horizontais separadamente, mas estamos usando a mesma função. Você definitivamente pode fazer uma linha horizontal e, em seguida, uma função separada para uma linha vertical. Mas você vai ver que é muito semelhante a cada vez. Mas dessa forma você está criando apenas uma função e, em seguida, a está usando tanto para linhas verticais quanto horizontais. E a maneira como você pode fazer isso é assim. Então, digamos que estou tentando mortes a partir do ponto zero. E então, para este também, estou secando. Então, a partir de 00 basicamente, isso é x e y. E então a resolução permanecerá a mesma. E então, para o primeiro, que é x gap, vamos usar x cap e ygap. E, finalmente, um valor para cada deslocamento. Então, vou continuar com isso. E agora esse é o truque. Então, por enquanto, isso é o que temos. E se eu fizer isso, será uma linha diagonal, como um saco porque estamos usando x e y juntos. Então, como você pode criar apenas uma linha horizontal ou uma linha vertical é criando a posição da primeira nesta linha. Então isso é x e y. E então, para x cap e y gap, você só usará um deles. Então, por que lacuna, será 0 porque eu não tenho nada para dividir. E então, para o deslocamento X, porque estamos desenhando horizontalmente, não precisamos de um deslocamento para x, precisamos de um deslocamento para y. E agora, se eu desenhar isso, ele será alinhado em 000. Então, se eu mover isso a altura dividida por dois. Então, no centro da tela, podemos ver que ele está funcionando para garantir que ele funcione também para linhas verticais. Vou copiar isso e vou deixar isso como 0. Mas use uma grande lacuna. E então o deslocamento para o x, será quatro. E o deslocamento para y será 0. E essa é a linha aqui. Então eu tenho que movê-lo para a largura dividido por dois para que você possa vê-lo. E essa é a linha vertical. Então, sabemos que isso funciona para linhas verticais e linhas horizontais. Agora é hora de criar nossa classe, criar o retângulo. Vou criar uma nova guia, e vou simplesmente chamá-la de poli. Então, para polígono, você pode chamá-lo de qualquer coisa. Não vou especificar isso como um retângulo, mas sinta-se à vontade para fazê-lo. E agora você pode definir o polígono usando apenas a resolução e, em seguida, especificar a largura e a altura aleatoriamente. Ou você pode usar XY, largura e altura com uma resolução. Então, basicamente, criando um retângulo, vou fazer os dois construtores. Então, o primeiro será o aleatório só para que possamos ver como funciona. Então, vou fazer resolução aqui. E é claro que também tem que ser visível aqui. Também tem que ser definido lá em cima. Agora Raz vai igualar o resto de sublinhado para x. Vamos passar de 02 larguras aleatoriamente. E então, para y, será altura aleatória. E esses também serão definidos aqui em cima. E também defina largura e altura. Portanto, essas são as propriedades de qualquer retângulo basicamente. E largura e altura serão, porque eu queria que fossem quadrados por enquanto, porque acho que os quadrados são mais fáceis de trabalhar. E então os retângulos são simplesmente uma altura diferente da largura. Vou fazer de 20 a 100. E então, para a altura, vou torná-lo igual à largura. Depois disso, vou puxar essa coisa toda para esta classe. Agora nós o temos aqui e, em seguida, Comando T ou controle T no Windows para formatar lá, apenas para limpá-lo. E então terminou o método de exibição. Vamos criar um retângulo como referência. Então eu farei este retângulo x em x e y, e depois largura e altura. E então criarei esses retângulos. Então, vou agarrá-los. E então definirei a lacuna x aqui. E por que lacuna também. E, finalmente, o deslocamento será em quatro. Agora não precisamos mais disso. Nem precisamos deles por enquanto. E em vez de usar esses valores, vou usar x e y. Então, para o primeiro, estará onde quer que x e yesteja. Então esse é o canto de qualquer retângulo. E esta é a nossa referência aqui. Então X e Y serão o canto, então é aí que vamos começar. E este é o horizontal e, em seguida, será x gap. E então não há, Não por que lacunas aqui, porque esta é uma linha horizontal. E então não precisamos de um deslocamento para xporque. Só precisamos deslocá-lo no eixo y. E então, para este, vamos desenhar a linha vertical à direita. Então, o que vamos fazer é adicionar a largura a x. Isso basicamente irá empurrá-la pelo quadrado ou retângulo diversificado de largura. E então teremos 0 para x gap. E então por que lacuna? Novamente, para cada linha horizontal, haverá uma tampa x e um deslocamento Y. Para cada, para cada linha vertical lá, haverá uma ampla lacuna e um deslocamento X. Então o deslocamento será para o x e então y será 0. Agora, para o inferior, ele estará na posição x porque vamos iniciá-lo do mesmo ponto que o de cima. E então vamos adicionar a altura a y porque estamos aqui e precisamos descer aqui. Isso terá uma tampa x porque é uma linha horizontal. E então ele vai ter um deslocamento y. E para o último terá x e y porque estamos começando do mesmo canto inicial. Porque para as linhas verticais estamos indo de cima para baixo. E então ele não terá deslocamento ou nenhuma lacuna para x e, em seguida, um amplo espaço e depois Offset e 0. Certo, o polígono Paul aqui. E Paulo II será igual a um novo polígono ou uma classe poli. E então faremos a resolução. Então, vou simplesmente começar, vamos fazer cinco. E então vamos desenhá-lo em margem, margem. E eu farei isso aqui. Então, vou criar uma margem para que você possa vê-la. Porque se eu fizer apenas 000, então ele vai ficar escondido nas laterais às vezes. Então, para que fique mais claro, para nós vermos, então vou fazer uma margem de 50 ou até 20 é bom. E então vou fazer com menos a margem. Então, temos a margem do lado direito também. E então o mesmo para a altura. Oh, eu esqueci disso. Eu não criei esse construtor ainda, então vamos fazer isso, o aleatório. Portanto, ele só definirá a resolução. E então eu vou desenhar. Vou exibir isso aqui. O que você está vendo por baixo dela é a referência ou o retângulo, para que você possa ver que ele está seguindo perfeitamente. Agora, se eu remover essa parte, poderemos ver nosso retângulo. E quanto menor for, mais distorcida ela parecerá porque a resolução é fixa para todos eles. Então, se você apenas reduzir a resolução, será mais como um visual desenhado à mão. Isso vai funcionar bem. Se eu tiver um ArrayList, digamos, de polígonos. E então adicionarei uma nova lista. Tenho que criar um loop. Então, digamos que 10, então isso vai funcionar bem. É, não é importante saber a posição exacta X e Y ou a largura e a altura. No entanto, se eu quiser criar algo assim, precisarei saber especificamente onde o x e y estarão ou se eu quero criar uma grade usando esses retângulos que terei que ser mais específico com a configuração do x e y e largura e altura para cada um dos retângulos. Então, vou criar outro construtor, e desta vez vou apenas copiar e colar isso. E adicionarei o valor x. E então eu também adicionarei y, largura e finalmente altura. Portanto, temos as propriedades básicas para que nosso retângulo seja desenhado. E agora vou mudar tudo isso para ter largura e sublinhado do XOM y. E vou mudar isso para altura para que ele possa defini-lo posteriormente quando quisermos criá-lo. E se eu for aqui e eu, digamos que eu queira criar um tópico ou uma linha. Retângulos. Então eu posso simplesmente multiplicar pela largura dividida por 10. E então faremos a altura dividida por dois para a posição de sua altura. Ou se a posição y. E então todos fazem largura dividida por 10. E este, além de ser a largura dividida por 10, que é a altura de cada um dos retângulos, que os torna quadrados. E agora você tem uma linha de retângulos. Observe também que isso está sendo desenhado do canto. Então, se você precisar empurrá-lo para cima, para que a altura esteja perfeitamente no centro. Você precisará subtrair a largura dividida por 10, dividida por 2. E isso vai ser exatamente no centro. Porque com dividido por 10 é a largura e a altura desses retângulos. E dividir isso por 2 vai apenas empurrar esse canto para cima pela metade da altura, o que faz com que o ponto central agora atravesse o centro desses retângulos. A outra metade da lição que você pode criar usando o curso de recursões. Você não precisa fazer esse curso porque vou tentar explicar isso da melhor maneira possível em um curto período de tempo. Mas é claro que é um pouco absurdo seguir todo esse curso e discá-lo apenas para essa lição e esperar que você entenda tudo se você não tiver uma compreensão do que são recursões. Além disso, as outras partes de algumas das lições serão apenas exemplos para mostrar como você pode usar o que estamos criando para textura. Em outros exemplos que criamos antes ou apenas em seu trabalho geral. Então você pode usar isso usando o curso de introdução à arte generativa. O que significa que você pode usá-lo para criar uma grade desse tipo de retângulos. Ou você pode fazer o que vou fazer agora para substituir o que usamos como retângulos ou os retângulos primitivos que usamos no curso de funções recursivas com esse retângulo que acabamos de criar para adicionar textura a isso. Portanto, as funções recursivas em poucas palavras estão repetindo o mesmo código repetidamente usando funções aninhadas. Então, em vez de usar loops, vamos chamar a função dentro de si mesma, o que pode produzir um loop infinito. Mas se você controlá-lo com uma condição, então você está bem e poderá criar resultados realmente ótimos com ela. Vamos fazer o exemplo mais simples daqueles na classe de funções recursivas, e esse é o exemplo dos quadrados. Então, o que vou fazer aqui é remover o que criei aqui e remover o método de exibição, basta colocá-lo na gaveta para que faça mais sentido que estejamos secando dentro da tela. Mas então eu vou simplesmente não chamar nenhum loop todos os anos. Para fazer isso muito rapidamente. O que vamos precisar é de um método que você possa chamar de qualquer coisa, mas vamos chamá-lo de gerar porque ele vai gerar nova geração sempre. E então vamos dar um número a ele. E esse número será o número de gerações. E então, dentro dela, teremos uma ArrayList que vou chamar temporária. E então essa ArrayList terá os polígonos que serão a próxima geração. E eles serão do tipo Holly ou nossa classe que criamos. E então porque eu disse que vamos chamar a função dentro de si mesmo para criar esse loop infinito. Vamos chamá-lo aqui. E então vou passar a degeneração porque também vamos diminuir a geração todas as vezes. E então eu vou fazer, ou vou pedir a essa função para fazer apenas o que eu estou pedindo que ela faça dentro dessa condição se a geração for maior que uma. Porque eu quero evitar o loop infinito. Portanto, é semelhante a um loop while de certa forma porque um loop while tem toda a variável de tema ou tem aqui ou antes dela. E depois há uma condição, e então há um incremento dentro desse loop. E nosso loop é toda essa função. Então, vamos colocá-lo aqui. E vamos diminuir todas as vezes. Então, se eu colocar aqui cinco gerações, então ele vai fazer isso para a primeira. Vai verificar se é maior que 15 é maior que um. Isso vai diminuir depois que tudo for feito aqui. E então serão quatro. E quando chegar a um , ele verificará se é maior que um, não é. Então, ele vai parar. E agora dentro disso, vamos percorrer todos os polígonos que estão dentro de sua ArrayList. No momento, não temos nada, então vamos adicionar um a isso. Vamos dar uma resolução. Então eu vou ligar, chamá-lo de resina Polya, chamá-lo aqui ou defini-lo aqui. E vamos fazer apenas três. E então eu vou desenhar um grande retângulo de margem, margem para quê? Menos margem e altura menos margem. Esquecemos de adicionar nova MyClass. Agora temos um de nossos retângulos e porque estamos exibindo aqui, se eu bater em corrida, então nós temos isso. Também. Vou ter que multiplicar isso por dois porque estou empurrando isso pela margem, e então estou empurrando isso pela margem, mas está aqui em cima, então preciso empurrá-lo pela margem multiplicada por dois. E agora temos um retângulo ou um quadrado. Então, o que estou fazendo aqui é fazer um loop. Então vou fazer Paulie, Paulie em Holly's. Estou passando por todos os itens na ArrayList, e vou dividi-los aqui. Então agora só temos um. Vamos dividi-lo aqui. E depois vou fazer o que quer que pollicis faça o que quer que esteja em temperatura, porque vamos criar tudo dentro da ArrayList temporária. E então vou levar tudo dentro do tmp e mudar ou substituir o que estiver em poli. Então agora temos uma nova geração e a ArrayList de Pauli. E mais tarde vamos percorrer todos esses e depois dividi-los novamente. Então, vai ser um loop de divisão. E a maneira como você pode fazer isso é primeiro adicioná-lo à matriz temporária, mas você adicionará um novo polígono. E o novo polígono será uma fração do tamanho do polígono original da primeira geração que estamos agarrando. Então, para isso, serão eras poli. E então vamos, na verdade, eu vou mudar isso para apenas p porque isso vai ser muito, muito longo. Então, vou pegar a exposição porque, para a primeira, quero que ela esteja na mesma posição x e y. E eu também vou pegar a posição y. Mas então eu quero ter a largura e depois a altura. Vou dividir isso por dois. E então eu vou ligar para gerar dentro da configuração. E eu vou fazer isso só para, então vou dar duas gerações. Ok, então eu cometi um erro, que é colocar isso fora do se condicional, mas eu disse que é como um loop while e o loop while decrements dentro do condicional. Então, agora, se eu executá-lo, nós temos isso. Agora você não tem a primeira geração, você só tem a segunda. Se eu fizer isso três vezes, você verá que não é apenas um quarto do tamanho do maior, mas também do menor. Então vou voltar para dois e vamos criar os outros quatro. Porque queremos transformar cada um dos quadrados em quatro quadrados diferentes. Agora, para o segundo, estamos nos movendo por largura dividida por dois do original porque estamos percorrendo o que está lá no começo. Está se referindo a um aqui. Então você pode vê-los e podemos entender o que está acontecendo. Então ele começou o primeiro aqui e depois fomos apenas a meio caminho para a largura e a meio caminho da altura. Então esse é apenas 1 quarto do quadrado original. E então, para o segundo, ele começará a partir daqui. Então, metade da largura. Então eu vou fazer o que x for mais largura dividida por dois. Então a largura do ponto p dividida por dois, o resto permanecerá o mesmo. Então, se eu fizer duas gerações, então você verá que está funcionando bem. Também não farei preenchimento. Então você pode ver as linhas. E agora, para o terceiro, não vou mover a largura ou não me moverei horizontalmente, mas vou me mover verticalmente. Então isso será y mais a altura dividida por dois. E então o final vai empurrar a largura e a altura. Agora temos quatro. Então, se eu fizer isso três gerações, então você verá que está cortando isso pela metade. E então, se eu fizer quatro gerações, então é cortá-las ou cortá-las para um quarto do quadrado original, e assim por diante. Mas para tornar isso um pouco mais interessante, o que você precisa fazer é simplesmente não cortar todos os quadrados. Então, se eu flutuar, ouvir novamente apenas um valor aleatório de 0 a um, e então eu verifico se r, Então eu dou a ele uma probabilidade de 50% para que ele seja dividido. E depois os outros 50%, os quadrados permanecerão os mesmos. Então, ele vai ficar no ponto P SPDY, pois terá a largura total e a altura total. Então agora você pode ver que é mais interessante porque essa parte foi dividida por todas as gerações. Este só foi dividi-lo duas vezes. Então, um foi dividido apenas uma vez. Você pode executá-lo quantas vezes quiser e sempre obterá resultados diferentes. Você também pode alterar a probabilidade aqui de 50% para cada um fazer algo diferente. Então, digamos que você queira que a maioria seja cortada, então você fará 70% para que isso seja cortado. Então, se r for menor que 0,7, então você verá que mais deles serão cortados. E se você quiser colorir isso, você pode simplesmente adicionar uma variedade de cores a isso. Então, podemos simplesmente preencher isso com cores porque as linhas não estavam realmente desenhando um retângulo. Estamos apenas tentando um monte de linhas para que você possa desenhar retângulos e esses serão coloridos. Você também pode adicionar margens a elas. Então, se eu fizer x menos 2 ou x mais dois na verdade. Então, se eu vim aqui e faço mais dois para aqueles e depois menos 2 para eles. Então, como se eu adicionasse a margem de dois e depois adicionasse uma margem extra para a. Então, se eu fizer isso agora você pode ver que há um pouco de espaço. E então eu posso adicionar outra margem ou margem extra apenas para os retângulos internos. Você pode vê-lo um pouco mais claro e você pode remover o traçado deste. Porque agora estamos vendo o dobro do traço. Então você não pode fazer nenhum traço aqui e depois traçado de preto para este. E temos um novo retângulo inventado usado e funções recursivas. Isso é praticamente tudo o que você precisa saber sobre essa parte da textura um. Na próxima lição, falaremos mais sobre cores, especificamente interpolação de cores aleatória. 4. Cor de aleatória: Nesta lição, começaremos a falar sobre cores, especificamente interpolação de cores. Eu falei sobre isso em outro curso. Mas eu queria compartilhá-lo aqui apenas para que tenhamos um acúmulo de maneiras de colorir seu design. Portanto, a interpolação de cores basicamente cria um gradiente de uma cor de sua escolha para outra cor com base no mapeamento de valor. Então, com base no tempo, que é o terceiro argumento para essa função ou para esse método de cor labial. No entanto, hoje não vamos mapear a hora ou o valor do terceiro argumento para nada na tela. Vamos usar a aleatoriedade para brincar com as cores que esse método cria. Para esta lição mergulhará diretamente no exemplo, porque não será um exemplo muito difícil. E vamos usar algumas das técnicas que usamos nos exemplos anteriores. Então, criarei uma nova guia porque vamos criar uma classe de agente. Para este agente Tom vai exibir arcos, círculos e linhas. Então, para isso, vamos precisar de uma posição x e y e um raio. E então definitivamente usaremos cores. Então, vou criar três cores. Um, vou ligar para chamar, e os outros dois, vou chamar um e cultura para a primeira cor, o gradiente e a segunda cor. Agora, dentro do construtor, vamos inicializar nosso x e y e o raio. Então, x será um valor aleatório. E vamos fazê-lo de margem em largura menos margem. E definirei margem. Bem aqui. Y vai ser a mesma coisa, mas com altura. Dessa forma, temos espaço ao redor da tela. Então, nada está amontoado para as fronteiras. E então r será apenas um valor aleatório de, digamos, 3200. E agora para as cores, vamos começar primeiro com preto e branco. É assim que eu gosto de começar. Sempre que um design algo novo, farei a primeira cor, soldados brancos para colorir. E depois 255 para branco. E então dois serão pretos. E agora vamos definir o método de interpolação de cores. Portanto, o método é chamado de cor do Blurb. E então pega a primeira cor, a segunda cor, e eu pego o valor do tempo. Então, se você quiser mapear isso de 0 para a largura da tela, as cores mudarão desse ponto para o outro ponto com base em quais formas ainda. Portanto, se todas as suas formas estiverem apertadas no lado direito da tela, elas terão a segunda cor. Como esse valor vai de 0 a 10 será a primeira cor e uma será essa. E então todos os números entre eles serão quaisquer cores entre 255, que é branco e 0 que é preto. Mas aqui vou apenas dizer, quero um valor aleatório de 0 a um. E isso vai fazer o truque para nós. E agora vamos exibir algo. Vamos começar com um círculo. E vou dar x e y. e depois o raio. Além disso, uso raio e círculos, mesmo que isso seja considerado o diâmetro. Então, mesmo que eu esteja inicializando um raio aqui, eu ainda o uso aqui como diâmetro. Então você também pode fazer multiplicado por dois, mas eu vou mantê-lo assim. E depois a cor. Então, o preenchimento dele será o que definimos com o método de interpolação de cores. Agora vamos voltar aqui e vamos definir uma variedade de agentes de Adrian ou ArrayList. E então eu vou para cá. E eu vou fazer com que os agentes adicionem um novo agente. E então eu vou. Todos eles. Então, para o agente, vamos chamá-lo de agentes agentes. E então vou mostrar isso. Então, como você pode ver, estamos recebendo um preenchimento aleatório de 0 a 255. Isso é semelhante a escolher uma cor aleatória de preto para branco ou de 0 a 255 quando você está fazendo isso aqui. Então, dizer aleatoriamente de 0 a 255, e não precisamos fazer o 0. É a mesma coisa. A única diferença é que ele vai piscar porque adicionamos o preenchimento aqui. Então, se eu fizer isso aqui, e vamos ter que convertê-lo em um número inteiro porque as cores realmente um inteiro. E isso é a mesma coisa. No entanto, se eu vou escolher cores diferentes de branco e preto, teremos um resultado muito diferente. Então, vamos definir uma variedade de cores. Eu tenho um que vou definir aqui em cima. E agora, em vez de obter ou em vez de definir as cores manualmente, podemos apenas obter um valor aleatório da matriz. Então, temos um monte de cores aqui que eu posso escolher. E faremos isso da mesma forma que fizemos a coloração aleatória antes. Então, estamos recebendo um índice aleatório para a matriz. E temos que lançá-lo em um número inteiro porque os índices não podem ser flutuantes. Então eu posso fazer chamadas comprimento do ponto. E agora, por causa disso, ele vai ser um número inteiro e vai funcionar. Agora o mesmo vale para o outro. Você também pode usar dois raios diferentes para eles. Ou você pode escolher manualmente as cores que quiser. Mas vou mantê-lo aleatório. E então aqui ele vai ficar o mesmo. E o preenchimento vai levar esse interpolador de cores. Agora, se eu executar isso, começaremos a ver mais cores. Agora, algumas dessas cores, como essa cor de filme ou essa cor verde escura, não estão na minha matriz, mas porque estamos obtendo uma cor e interpolando ela funciona criando um gradiente dessa cor para a segunda cor. Ele está agarrando o que está no meio entre essas cores. Então, digamos que eu vou de rosa a azul, então definitivamente vou ter mais cores de filmes. Então este e este é definitivamente algo que vai de rosa a laranja ou amarelo. E essa forma de repleção de corantes muda com base no seu modo de cor. Então, se mudarmos o modo de cor para algo como HSB, digamos. E então eu executo isso, vamos ter uma variedade diferente de cores. A razão para isso é porque apenas a velocidade gira ao redor da roda de cores. Então, entre as duas cores, não é necessariamente o que você consideraria o acúmulo dessas duas cores. Então, antes com o RGB, se eu pegar vermelho e azul, então vou colocar roxos entre eles. No entanto, com o modo HSB, vamos passar pela roda de cores. O único objetivo desta técnica é mostrar que você pode usar o método aleatório para, com o método de interpolação de cores para obter uma variedade de cores de apenas cinco cores, o que lhe dá um pouco mais de interesse do que o normal variedade de cores que você escolhe. Então eu vou voltar, e você pode ver as mudanças de humor mesmo quando eu mudo de um modo para outro. Ok, agora em vez de fazer assim, vamos continuar o exemplo, que não é necessariamente importante para, para você aprender esta lição, mas eu queria que este fosse um exemplo completo mostrando como eu uso interpolação de cores ou como eu usaria potencialmente a interpolação de cores em meus designs. Então, uma coisa que fiz com este exemplo é obter um valor aleatório. Vou chamá-lo aleatório porque eles já têm R como raio. E então eu vou inicializá-lo aqui. E porque é um número inteiro, vou lançar aleatoriamente em um número inteiro. E eu quero cinco formas diferentes. Então, vou usar apenas cinco. Então, vou pegar de 0 a quatro. E agora aqui no método de exibição, em vez de usar apenas o círculo, vou verificar se aleatório. Igual a 0. E eu quero outra forma. E então, se aleatório for igual 1 ou aleatório é igual a 4. Então, na verdade, não são cinco formas, mas eu consideraria cinco formas só porque quero que a probabilidade de obter um círculo seja maior. E eu escolhi se é um ou quatro, f é igual a dois e depois três. Então, um amigo m igual a 0, vou criar um arco. E vai ser um x e y. Na verdade, é em vez de x e y porque depois eu também vou movê-lo. Vou empurrar. Os estilos adicionam um método push e pop. Para usar traduzir e girar. Translate vai definir a posição de cada uma dessas formas, agora podemos usar apenas 00 para cada uma dessas posições. E então a arte assume a posição X e Y primeiro e, em seguida, leva o diâmetro, a largura e a altura. Então, vou usar o raio como fiz com o círculo para ambos porque quero que seja um círculo. Não quero que seja uma elipse. E então vou de 0 para pi porque esses últimos argumentos são o ângulo inicial e o angular final ou onde o ângulo terminará. Então, imaginando um círculo com duas linhas perpendiculares entre si cruzando no centro do círculo. Então imagine que o lado leste seja este ponto, o ângulo inicial. Então, ele sempre começa a partir daí. Então vou de 0 para Pi, ou seja, metade desse círculo. Então aqui estamos desenhando meio círculo. E então aqui, vou fazer o mesmo para o começo. E então, para o segundo, vou de 0. Desta vez vou desenhar três quartos do círculo. Então isso vai ser pi, que é metade, e depois metade Pi, que é um quarto do círculo. E dessa forma temos três quartos. Finalmente, vou desenhar uma linha. E esta linha, eu quero que ela vá de algum tipo de como desenhar a linha horizontal em um círculo. Então vou passar do raio dividido por dois porque estou agindo como se este fosse o diâmetro, que eu deveria chamar de diâmetro aqui, mas é que eu deveria chamar de diâmetro aqui, apenas um hábito de Rinoceronte. Então r dividido por dois e r dividido por dois. E isso é tudo o que precisamos para isso. Então, se eu for agora e executar isso, veremos que temos uma infinidade de formas. Então temos três quartos por círculo, temos meio círculos, temos círculos cheios e temos essas linhas para as linhas, na verdade, para tudo. Eu não quero um preenchimento. Em vez disso, vou usar um derrame porque quero um visual diferente. E vamos fazer com que o peso do traço seja grande, então 15. E então eu também vou fazer a tampa do traçado em quadrado. Porque para as linhas eles vão ter tampas redondas. Quero mudá-los para quadrado. Não é importante, claro. E então também não farei nenhum preenchimento. E porque temos muitos estilos aqui, podemos fazer estilo. E eu posso remover tudo isso daqui no período aqui. E podemos até colorir dentro dos métodos push e pop. Então eu posso apenas fazer estilo aqui. E agora, se eu executar isso, teremos um design melhor na verdade. Mas outra coisa que vou acrescentar a isso que vai torná-lo divertido é uma animação. No entanto, não podemos fazer essa animação porque não poderemos vê-la até que eu faça a detecção de colisão que fizemos anteriormente. Vou mostrar-lhe primeiro a animação. Vou te mostrar como isso não vai ficar bem. Para qualquer animação. Vamos precisar de um ângulo e a velocidade. Então isso vai ser ângulo. E então eu vou chamá-lo de velocidade para velocidade angular. E então vou defini-los aqui. Então, vai ser ângulo. E a razão pela qual estou definindo aqui, porque não quero que todos comecem do mesmo ângulo. Quero ter uma rotação aleatória para cada um deles. Então, vou fazer 2 pi aleatórios. Então isso vai me dar um valor aleatório de 0 a dois pi. Então, círculo completo basicamente. E depois uma velocidade. Também será um valor aleatório que será de menos 0,52,5. E agora aqui, na seção de rotação ou tradução, também vou girar ou essa seção de transformação irá girá-la por ângulo e, em seguida, o ângulo se moverá ou vai atualizar e a atualização método vai ser atualizado pela velocidade. E agora nós apenas chamamos a atualização aqui. Agora, todos os métodos que estamos usando exibem uma atualização e, em seguida, o estilo que estamos usando dentro disso. Agora, se eu executar isso, tudo está girando e eu tenho que redefinir isso. Então, faça a rodada de agradecimento. Agora eu posso realmente vê-los girando e não e desenhando um sobre o outro como no que quer que esteja girando não está secando em vez de apenas redefinir e girar. Para mim, isso é tão legal. Parece uma máquina funcionando, mas acho que parece melhor se adicionarmos a detecção de colisão. Então, faremos isso usando o método collides. Como dissemos antes, ele vai devolver um booleano como gangue para pegar um agente e eu vou chamar outro. E então vamos pegar a distância de x e y para outro ponto y, ou seja, o centro para o centro. E então eu direi que se a distância for menor que o raio mais o outro raio, na verdade, ele terá que ser dividido por dois porque estamos usando o raio aqui como um diâmetro. Então é quando as coisas começam a ficar meio confusas por causa de eu escolher a variável errada, retornar true e então, de outra forma, ou aconteça o que acontecer, apenas faça false. Isso garante que estamos retornando um valor, independentemente de isso, se a condicional for mapeada ou não. E então vou até aqui e definirei um valor máximo. Aqui em cima. Vou apenas fazer a contagem MAX. E vamos fazer 50. Embora para o tamanho da tela 50 seja um pouco demais. Então, vamos fazer, sim, vamos reduzi-lo para 20. A razão pela qual adicionei a contagem máxima é porque não quero que ela adicione ou exceda esse valor máximo. Não quero que ele adicione mais de 20 círculos, digamos, ou formas. Então, direi que o tamanho do ponto dos agentes é menor que contagem máxima somente então eu quero que você adicione um novo agente. Então, se atingir esse valor, a contagem máxima, não quero mais que ele adicione agentes. E então faremos um loop for-loop. Para integer I igual a 0, eu é menor que o tamanho do ponto dos agentes porque estamos usando ArrayLists, não um array, então não usamos comprimento. E então eu mais, mais. Então, estamos incrementando em um como de costume. E então aqui vou definir j como o último agente. Na verdade, o que eu vou fazer aqui é percorrer apenas o agente desse tamanho, exceto o último, porque o último será j. Então, se agentes na posição j colidir com agentes ou qualquer agente na posição i então eu vou removê-lo. E é aqui que a contagem máxima é útil porque se todos eles colidirem, então não teremos nada aqui. Portanto, não é apenas para garantir que não excedemos a contagem máxima, seja também para garantir que estamos atingindo essa contagem máxima. Não estamos apenas ficando também porque a maioria deles colidiu e depois tivemos que removê-los. E agora, se eu executar isso, veremos que eles não colidem. Na verdade, a razão pela qual eles estão colidindo é por causa do peso do AVC. Então, podemos adicionar isso aqui. Posso dizer mais o peso do traço se eu defini-lo em outro lugar. Então, vamos dizer isso. Vou chamar o traçado w. e então aqui vou dizer que o traço é igual a 15. E temos que defini-lo aqui em cima também. E agora posso adicioná-lo aqui. Podemos apenas fazer mais 15 se você souber que está sempre sendo, será um valor constante. E é claro que aqui vai ser outro dardo porque se você quiser que eles tenham pesos aleatórios, essa é a maneira de fazê-lo. Mais peso do traço para este e, em seguida, mais outro peso de acidente vascular cerebral adulto para esse. Então, ele agarra o peso correto do traçado para cada um desses. E agora não vamos ver nenhuma colisão. Então, como a tela é muito pequena, não veremos muito por muito tempo. Então, vamos realmente fazer isso um pouco maior. Na verdade, o dobro. E agora toda vez que você executa, não há colisão e está girando e está criando visuais agradáveis. E como temos uma rotação inicial aleatória, você pode ver que algo assim não está realmente começando na mesma posição que esta ou na mesma rotação é essa. E então, porque eles têm velocidade aleatória, você verá uma velocidade diferente. E a razão pela qual eu usei a linha, bem como porque, à medida que ela gira , ela também cria um círculo, dá uma aparência mais coesa, mas ainda tem algumas variações. E então você pode salvar a animação se quiser. Violência, digamos que uma contagem de quadros seja inferior dezenas, dezenas de quadros em, se você especificar a taxa de quadros aqui em, digamos 30 quadros por segundo ou 24, então você pode especificar, ou você pode calcule quantos minutos você quer e, portanto, quantos quadros você deseja. E certifique-se de fazer menos ou igual se estiver colocando a contagem exata de quadros desejada. E então você salvará o quadro. E, em seguida, faça a saída se você quiser colocá-lo dentro de uma pasta chamada saída para organização. E então eu só gosto de exportá-los como PNGs. E você pode fazer outra coisa. Saia. Dessa forma. Vai de 0 a 1000 quadros. Ele salvará todos esses quadros com os dígitos desse quadro. E então, uma vez feito, isso não será verdade. Então isso vai ser verdade e então ele sairá. E a saída vai fechar esta tela de visualização que só precisa saber sobre essa técnica de coloração. Na próxima lição, falaremos mais sobre textura, especificamente imagens de fundo. 5. Textura 2: imagens de fundo: A segunda técnica de textura sobre a qual vamos falar é extremamente simples. E é apenas adicionar uma imagem de fundo ao seu design. Quando eu insiro esta obra de arte nas redes sociais, uma das perguntas interessantes que tenho é de onde você tirou esse histórico? E nunca pensei que algo tão simples como adicionar uma imagem de fundo de um papel antigo ou de qualquer papel, em vez disso, seria significativo para a obra de arte. Mas escolhi isso como uma das técnicas de texturização porque acho interessante usar o modo de mesclagem para ver como a arte interage com o plano de fundo. Então, o exemplo será um pouco complexo. Vamos usar o ruído 3D. Então, basicamente, o que criamos e o ruído fluído no curso. No entanto, em vez de colocá-lo em apenas um fundo normal, um fundo sólido, vamos colocá-lo em uma imagem de fundo, que irá elevá-la um pouco e torná-la mais parecida com o desenho que você criou à mão. Eu escolhi especificamente o ruído 3D com este porque parece mais que você pintou isso ou desenhou com caneta no papel. Mas estamos usando arte gerativa criada. Agora, porque isso é tudo sobre adicionar imagens de fundo. Começaremos adicionando a imagem. Escolhi a imagem de um site chamado Unsplash.com, onde você pode obter muitas imagens livres de direitos autorais, imagens de alta qualidade. Então eu pesquisei planos de fundo em papel e tive um tempo, e isso é o que vamos usar hoje com essa obra de arte. Então, vamos colocá-lo na pasta. Na pasta de esboços. Vamos adicionar uma pasta de dados. E eu vou puxar isso para aqui. E eu o renomeei para papel sublinhado um. Portanto, é muito mais fácil importá-lo mais tarde. Então, vamos usar a imagem P, e vou simplesmente chamá-la de fundo ou BG para abreviar. E vamos inicializá-lo aqui. Então, o plano de fundo vai carregar uma imagem e a imagem será sublinhado em papel um ponto JPEG. E agora também vamos redimensioná-lo para largura e altura. Isso definitivamente distorcerá a imagem porque temos um papel vertical e isso vai esmagá-lo. Então, se mostrarmos agora, você verá que alguns dos detalhes são um pouco diferentes. Se você voltar para a imagem original que abrimos, não é um problema muito aqui porque os detalhes não são importantes, por isso não mostra muito a distorção. Mas se isso te incomoda tanto, então redimensione-o por proporção. Se você conhece a proporção original da imagem. E agora, se você quiser desenhar algo em cima disso, então digamos que eu queira desenhar uma elipse. E vamos colocá-lo no centro da tela. E vou dar-lhe uma largura de 100 por 100. E também adicionarei a imagem aqui apenas para redefini-la. Então, em vez de plano de fundo, não precisa mais do plano de fundo. Vamos usar a imagem para redefinir qualquer coisa aqui. E se eu executar isso agora, podemos ver isso em cima disso. Agora, se eu mudar esse preenchimento para, digamos vermelho. E então eu uso o modo de mesclagem. Antes de usar o modo de mesclagem, mostrarei primeiro. Então esse é o normal. E então, se eu usar o modo de mesclagem para multiplicar, e houver vários modos de mesclagem. Portanto, o padrão é mesclagem e, em seguida, o resto que você pode encontrar na documentação. Portanto, há uma tela de multiplicação e, se você não sabe, multiplicação mantém as cores escuras e remove qualquer branco e a tela faz o contrário. Então, se você tiver uma imagem em preto e branco e se multiplicar, então você encontrará apenas as partes pretas da imagem aparecendo. E então, se você fizer a tela com a mesma imagem, descobrirá que apenas as partes brancas da imagem aparecerão. Então agora isso vai deixar isso um pouco mais escuro com base na cor por trás dele. E porque nossos fundos um pouco escuros, vai torná-lo um vermelho mais escuro. Agora, o problema com este é que o modo de mesclagem está se multiplicando sempre por tudo. Então, se eu fizer o modo de mesclagem. Agora você pode ver que isso é um pouco transparente para que possamos ver a textura por trás disso. E a imagem não obtém o mesmo modo de mesclagem que o preenchimento ou a elipse aqui porque eu recorrei à mistura. Agora vamos começar com o exemplo real. Então, vou remover tudo isso agora que descobrimos o que vamos fazer neste momento, vamos fazer isso com o ruído 3D. Então, em vez dessa elipse, vamos criar vértices são planos que vão correr pela tela usando ruído 3D. Então, vou chamá-lo de agente. E criaremos essa classe. Neste exemplo, vamos usar o ruído 3D. Portanto, teremos que definir a posição, o tamanho e a velocidade para que os pontos se movam usando o ruído. Então, na classe, adicionaremos essas propriedades. Vou apenas fazer x, y. E como usaremos ruído 3D, também usaremos z ou z. e então farei o tamanho e a velocidade do seu flutuador. Então, o tamanho será do tamanho dos pontos que estão se movendo. E a velocidade será a velocidade ou a velocidade deles. Para inicializá-los, vou adicionar alguns parâmetros ao agente. Então, usarei o x e y porque quero defini-los fora da classe. Agora atribua x ao que x vai ser e ao que quer que y seja. E então, para z, e z será um valor aleatório. E vamos fazer isso de 0 a 208. Eu costumo ser muito pequeno com o valor de C com ruído tridimensional. E, em seguida, tamanho indefinido em velocidades. Então, o tamanho será um valor aleatório. Vamos fazer isso de 0,5 a três. Quanto mais eles estão, mais eles se assemelharão a pinceladas de caneta. E então também vamos definir ou inicializar velocidades como um valor aleatório, como um valor aleatório de um a cinco. E então eu adicionei uma matriz de cores. Você pode usar a mesma matriz de cores que usamos desde o início dessas lições ou desde o início do curso. E farei o que fiz antes de usar um índice aleatório da matriz de chamadas que acabei de definir. Então, isso será um número inteiro. Dos valores aleatórios. Eles vão de 0 para o comprimento do ponto de chamadas. E teremos que definir a cor aqui. Então, disque a cor ou digite a cor. E agora vamos definir os estilos. Às vezes, gosto de manter os estilos separados do método de exibição ou separados da forma que vou definir no método de exibição. Especialmente se eu tiver muitas coisas no estilo. Mas aqui só teremos duas coisas. Então, o primeiro será o peso do traço. E esse será o tamanho. Então, como o tamanho de uma caneta. E depois faremos derrame. E não faremos nenhum preenchimento aqui porque não vamos precisar dele e não há necessidade de ele estar aqui dentro. Portanto, ele não é chamado toda vez que criamos um agente. E agora dentro desta peça trará nosso ponto de vista. E também usaremos o estilo. E o ponto vai ser um x e y. Muito simples. E, finalmente, na verdade, a última coisa que vamos criar na classe, esse será o método de atualização. Então é aqui que vamos criar o barulho. E o ruído será a rotação desses pontos. Então, vai ser o ângulo. E isso será x, y e z. No entanto, se eu usá-lo assim, ruído produz valores de 0 a um, e estes são muito pequenos. Então, vamos precisar multiplicá-lo pela força do ruído. E se você sentir que essa explicação é um pouco difícil de seguir. Ou se você acha que isso é um pouco avançado demais para você, então isso é algo que eu lidei mais fundo no curso de ruído fluindo. Então, se você quiser saber mais sobre o ruído e sua função, então eu sugeriria que você vá e assista o curso de ruído de fluxo primeiro e depois volte aqui. Mas, em suma, a força do ruído multiplicará qualquer valor aqui, e vai reclamar que não existe. Então, vamos criar variáveis globais aqui, ou, na verdade, constantes globais, porque eu sei que a força do ruído não vai mudar. Então, vou criar aqui. Mas antes de criarmos e também precisamos dividir x e y por escala de ruído. E a razão pela qual estou fazendo isso é porque os valores ou a função de ruído produzirão muitos valores. E a escala de ruído vai escalar parte dessa onda e usá-la. Então, é como ampliar para parte de uma onda. Então, se você olhar para montanhas de longe, verá muitos picos e vales. Mas se você for mais perto do que só verá o espaço em que você está. E o NoSQL faz exatamente isso. Então, se eu for aqui, podemos definir escala de ruído e força de ruído. E não precisamos repetir o flutuador, podemos apenas fazer vírgula e depois aplicaremos ou atribuiremos outro valor à força do ruído. Então eu atribuí escala de ruído, o valor de 5049 de força, fiz 100. Esses valores você pode alterar o quanto quiser. Quanto maior a escala de ruído, mais suave é o ruído. E quanto maior do que uma força, mais rotação você terá porque a usamos com ângulo aqui. Portanto, se a escala de ruído estiver se movendo ou ampliando em parte da onda, a força do ruído está aumentando a altura. E a parte baixa dessa onda pode incrementar x pelo cosseno do ângulo e depois multiplicá-la pela velocidade. Então, a velocidade vai agir como o raio porque isso produzirá valores de menos um para um e vamos precisar multiplicá-lo por um valor maior. E então para y será seno, o ângulo multiplicado pela velocidade. E também aumentaremos o valor z em algo como 0,005. Novamente, esse valor, você pode mudar o quanto quiser até encontrar os valores que você gosta ou a aparência que você gosta. Agora, o método final que vamos criar é o saldo. Agora salta, não vai fazer muito. Agora mesmo. Só vai restringir os valores x e y ou os pontos de ultrapassar os perímetros das telas. O que podemos fazer aqui é apenas restringir x de 0 à largura. E por que de 0 à altura. E você verá o que isso faz quando criarmos nosso array de agentes. Então isso é tudo o que precisamos por enquanto dentro da nossa classe de agentes, voltaremos a ela mais tarde para adicionar algumas coisas que serão o exemplo final. Então, por enquanto, vamos apenas criar uma matriz de agentes. Vou chamá-los de agentes. E vou dar-lhes uma contagem. Vamos começar com 10. Agora aqui vamos inicializar, criar instâncias dessa classe de agente. E um rehear no construtor só temos x e y. Então, vou fazer aleatoriamente de 0 para largura, aleatoriamente cerca de 0 para altura por enquanto. E então aqui embaixo faremos quatro agentes. E os agentes o exibirão e a data. E em vez de criar o ou, em vez de chamar os limites na guia principal, vou chamá-lo aqui. Assim como fizemos com estilo dentro da exibição. Fiz o mesmo dentro da atualização. Agora, se eu executar isso, podemos ver nosso ruído 3D. E, como você pode ver, uma vez que ele atingiu o 0 no eixo y, ele realmente parou de se mover e moveu-se apenas sobre essa parte. Então, sempre que estiver nos negativos, será sempre 0. E então, sempre que estiver além da altura, sempre será a altura. E é por isso que você vai ver esses pontos nas fronteiras. E se você mantê-los por muito tempo, verá uma borda no final com as diferentes cores que temos. E agora, como a velocidade é muito alta, nós realmente vemos que os pontos não estão vendo uma linha suave. Tudo bem. Vamos corrigir isso mais tarde quando terminarmos o exemplo. Então, se voltarmos para a guia Principal, agora o que vamos fazer é criar uma grade. E em vez de criar os limites entre o ponto zero e a largura e a altura da tela. Vamos restringi-los nas células da nossa grade. Então, vou criar uma grade e, em seguida, cada ponto assumirá sua posição em uma das células. E então ele será restringido por dentro disso. Para fazer isso, vamos criar um método que vou chamar de net grad. Então, isso inicializará as posições para nós mesmos. Isso será para inteiro n igual a 0. E então n será a área ou menor que a área. A razão pela qual estou indo por área em vez do número de colunas e número de linhas é porque eu não quero aninhar loops. Quero reduzir o número de voltas o máximo que puder. Então, vou inicializar uma variável chamada área, e isso será contado para a potência de 2, basicamente a largura multiplicada pela altura. Portanto, o número de linhas o multiplica pelo número de colunas. E isso também será aqui. Portanto, o número de agentes será o mesmo número de células em nossa grade. Agora eu posso fazer eu e posso fazer J também. Então eu vou ser n modulo contagens, e então aqui, n será dividido por contagem. Então, para as colunas, então de 0 para a largura, vamos de 0 para o número de colunas, obtendo o restante da divisão N pela contagem. Em seguida, obteremos números de 0 para a contagem. E então, para as linhas, vamos dividir n, que é a área pelo número de linhas. Fizemos o oposto do que fizemos para criar a área. E isso nos dará todas as posições de 0 à altura. E agora, para inicializá-lo, vou criar uma série de posições. Vou criá-lo aqui. E isso vai ser um vetor p. E a razão pela qual estou criando um vetor p é evitar a criação de matrizes flutuantes uma para x e outra para y. e essa também será a área ou terá o comprimento de uma área. E então aqui eu vou fazer a posição em N será igual a um novo vetor p em i multiplicado pela largura da célula e j multiplicá-lo por uma altura de célula. E agora vamos defini-los. Então, se eu subir aqui e eu fizer a largura da célula flutuante e vender altura. E então aqui vou fazer a largura da célula igual a largura dividida pelo flutuador de contagens e, em seguida, a altura dividida pelo flutuador de contagem. E vamos precisar de flutuação porque precisamos de um cálculo mais preciso. Porque se eles não fizerem isso e este for um número inteiro, f largura não é divisível pela contagem, então vamos ver lacunas em nossa grade. Agora que temos isso, não devemos receber um erro aqui. E eu posso inicializar o subsídio aqui. Vamos também adicionar margens. Se eu fizer isso agora, o melhor será nas bordas da tela e isso não ficará ótimo. Então, vou adicionar as margens aqui. Agora basta fazer 50. Então agora a largura da célula e a altura da venda não serão apenas a largura dividida pela contagem. Vai ser largura menos as duas margens. Então, a margem multiplicada por dois. Assim, estamos subtraindo as margens da largura e da altura. Então, estamos criando uma nova largura e altura. Agora, em vez de escolher uma largura e altura aleatórias, quero que cada um dos agentes comece a partir de cada célula. Então, para isso, vamos usar tudo o que inicializamos aqui. Então, já criamos os pontos. Podemos usá-lo aqui. Essa será a posição I ponto x e, em seguida, posição I ponto y. Se eu executar isso, veremos pontos começando de cada célula. No entanto, não estamos vendo isso muito bem. E também vamos precisar empurrar porque se você notar, tudo começou a partir daqui e depois parar por aqui. Isso porque excluímos as margens. Vamos precisar empurrá-los para cá. Então, se eu fizer mais margem, e então aqui também, mais margem. Agora vamos vê-lo melhor e também precisaremos mudar isso para margem, margem e, em seguida, largura menos margem, certo? Margem. Então, estamos fazendo a partir da margem e , em seguida, duas margem menos porque agora os limites estão realmente para as bordas. Então, se eu executar isso de novo, podemos vê-lo claro. Podemos ver a margem porque ela está parando aqui. E agora você pode ver como os limites estão realmente funcionando perfeitamente. Agora, a parte divertida está mudando as restrições aqui para limitar os pontos dentro de cada célula. Para fazer isso também, novamente, adicionar mais alguns parâmetros. O primeiro será a largura da célula e a altura de venda naturalmente, porque essas são nossas células de grade. E também vamos adicioná-lo aqui para que possamos passá-lo da guia principal, da grade ou desta parte aqui. Então, o que quer que inicializamos para a grade, e isso estará sob largura da célula acadêmica e a altura da célula sublinhada. E podemos inicializá-los aqui. Portanto, não vamos sublinhar a largura da célula. E o mesmo para a altura da célula. Porque isso está apenas nos dando a silhueta e a altura da venda, mas também precisa das posições. Então, onde quer que estejamos usando aqui, isso nos dará os cantos das células e , em seguida, os outros dois nos darão largura e altura. Então, precisamos adicionar isso. Agora podemos adicioná-los aqui. Então, darei a largura da célula e darei a altura da célula. Agora, se formos aqui, posso usar a largura da célula aqui. E vender a altura aqui porque x e y estão se movendo e estamos usando-os para as posições dos pontos à medida que eles estão se movendo, teremos que usar outra coisa além de x e y porque eles não vão funcionar, pois eles não vão funcionar, pois eles estão em constante movimento. Então, precisamos apenas pegar o valor x, o valor x inicial, que estamos passando aqui e começando o valor y. E vamos armazená-los dentro da célula x e vender y. e os, e aqueles que podemos criar aqui. Então essa será a célula X e venderá y. Então agora pegamos os valores iniciais. Agora nós os temos aqui. Então agora podemos mover isso confortavelmente sem nos preocupar com a primeira posição. E então adicionamos a largura da célula Q, seja qual for x e y. E agora aqui vamos usar o celular X e vender vinhos isso. E agora, se eu executar isso, veremos que eles estão restritos dentro de cada célula. Já parece ótimo, mas também podemos, então eles já estão ótimos, mas também podemos mudar algumas coisas. Então, em vez de ponto, vamos usar um vértice para fazê-los parecer mais conectados. E em vez de apenas pontos confusos como estão agora, você pode ver os pontos porque eles não estão se conectando uns aos outros. Mas se usarmos a forma Begin e, e formamos com vértices, poderemos conectá-los para que eles se pareçam mais com uma linha. Na verdade, antes de fazermos qualquer coisa, vamos redefini-lo usando a imagem. Vamos adicionar a imagem de fundo. Agora você pode vê-los se movendo. Também podemos adicionar alguns guias para que você possa ver onde as células começam e terminam. E isso é apenas criar uma grade normal. Vou chamá-los de guias. E então eu darei a eles uma contagem x e y contagem para o número de colunas e linhas. E então criarei variáveis locais para a área. E então também criarei largura e altura da célula local. Mas eles vão ser os mesmos. Então, vou pegar isso aqui. Mas, em vez de contar, será contagem x. E para a altura da célula, vai ser o mesmo, mas y conta, e isso vai ser altura. E então vou usar o mesmo loop que usamos aqui. Mas em vez de criar um novo vetor p, vou usar uma função retangular e ela terá a mesma posição x e y, mas depois sei também ter uma largura e altura de célula. Agora vamos precisar chamá-lo aqui. E isso exigirá uma contagem. E porque estou usando a contagem aqui como o número de linhas e colunas, então vou usá-lo aqui. Vou adicionar um traço a isso. E estou usando pop persa só para isso não afetar meus agentes. E podemos simplesmente torná-lo preto. E darei a ele uma capacidade de 50%. E agora podemos vê-lo. Também adicionarei um modo de mesclagem aqui para que você possa ver as cores melhor em cima do papel. E assim parece mais uma caneta real escrevendo no papel. Como eu disse, teremos que usar push and pop. Para empurrar os estilos é restringir os estilos apenas para os pontos. Ou você pode reatribuir o modo de mesclagem aqui para estes dentro deste pop persa. E posso ver que há um pouco mais escuro, mas não estamos vendo nada porque estamos redefinindo a imagem aqui. Então, na verdade, está se movendo em vez de tentar. Agora, para desenhá-lo, o que eu preciso mudar é esse ponto. Então, em vez de apontar, vou criar um loop. E vou dar uma contagem. E então eu também vou começar a forma e a forma. Porque vou criar uma linha usando vértices. Mas em vez de colocar o vértice aqui, preciso colocá-lo aqui dentro do método de atualização. Porque preciso que cada vértice tenha uma posição x e ydiferente. Se eu colocar tudo aqui, ele terá a mesma posição x e y e, em seguida, as coisas vão se mover, então ele não vai atualizar o vértice. E então chamarei o método de atualização aqui. Então, em vez de chamá-lo aqui, podemos usar o display e que chamaremos de estilo e atualização. E dentro da atualização, o método de limites será chamado e count será um parâmetro aqui. Então agora aqui dentro da exibição, posso fazer algo como 100 pontos. Agora, se eu executar isso, podemos ver que está criando uma linha, mas é muito rápido porque estamos nos movendo por essa velocidade dentro de espaços muito pequenos. Agora, a primeira coisa que eu gosto de fazer, geralmente quando algo assim acontece, é alterar a taxa de quadros e alterar o tamanho da tela. Então, se eu fizer algo como 1080 por 1080, você pode ver que a forma está mais espaçada ou a largura da célula é um pouco maior. Então, agora ele tem mais espaço para se mover, e então eu posso reduzir a taxa de quadros. Então, se eu for aqui e posso fazer a taxa de quadros, porque a taxa de quadros padrão é, acredito em 60 e vou reduzi-la para, digamos 12 ou até mesmo talvez 24. Mas até 24 horas muito rápido. Assim, você pode reduzir a velocidade aqui. Então, se eu fizer de 0,1 para digamos 0.5, você verá que o movimento diminuiu, mas então você terá que mudar muitos parâmetros porque mudar essa velocidade também afetará o ruído 3D. Então, traga-o de volta para um a cinco, e então eu vou reduzir isso para 12. E eu realmente gosto mais quando se parece mais com uma animação de stop motion. E então eu também posso aumentar isso porque agora temos uma tela maior, então 100 não será suficiente para preencher as células. Então, vou apenas fazer 500. E agora vamos ver que parece muito melhor. E para torná-lo ainda mais bonito, porque agora seus olhos vão por toda a tela. Então, para limitar o movimento do seu olho pela tela, podemos preencher algumas dessas células. Então, para fazer isso, voltarei para a classe do agente e criarei uma variável aleatória. Isso vou chamar de Rand. E será um valor aleatório de 0 a um. E então, dentro do estilo, essa pode não ser a maneira mais sábia de fazer isso porque só vou remover o traçado, porque só vou mover a cor do traçado, mas na verdade não estou removendo a instância de o agente. Então você pode fazer isso aqui para não inicializar todos os agentes, mas vou fazer uma solução simples aqui simplesmente removendo a cor do traçado. Então, se eu for aqui e eu farei se o amigo for, digamos menos de 0,7 ou 70%, então eu vou ter uma cor. Caso contrário, preciso do derrame ou realmente não preciso de derrame. E então, se eu pressionar Command T ou Control T em um PC, então você formatará isso automaticamente. Agora, se eu executar isso, podemos ver que nem todos eles estão realmente preenchidos. E dessa forma é menos barulhento. Também algo que vamos aprender na terceira técnica de texturização está adicionando elementos de fundo. Então eu já fiz algo aqui que vai estar relacionado a essa lição. E isso é criar esses guias e deixá-los. Assim, você pode remover esses guias, se quiser, apenas eliminando isso. Mas não parece tão bom quando você vê dessa maneira porque você não sabe por que ele está se comportando dessa maneira. No entanto, se você deixar seus guias do que parece melhor, porque agora você entende por que eles estão se movendo dessa forma ou por que eles estão confinados nesse espaço, porque na verdade há limites para eles permanecerem assim. Agora também podemos adicionar outra coisa, e essa é uma das razões pelas quais criei os guias com uma conta x e y, posso criar outra grade, mas desta vez ele pode ter quatro vezes a conta. E também posso dar uma cor diferente da matriz. Digamos que eu darei a segunda cor. E eu também vou fazer isso aos 50. Se eu executar isso, não vai parecer certo porque não estamos fazendo assim. Temos que fazer x count e y count, ou, na verdade, ambos serão xcount. Também mudarei a cor para que esta seja a primeira cor da matriz. Ou, na verdade, eu queria que fosse o oposto. Então o rosa vai estar lá dentro e este estará lá fora. E vou colocar isso antes porque preciso que as células maiores sejam as mais proeminentes, já que elas estão confinando a tela. E então também posso fazer o modo de mesclagem para esse também. Agora podemos ver o rosa melhor e podemos ver o azul melhor. Agora podemos brincar com a escala de ruído. Então, aumentando para 1000, talvez quanto mais você aumentar a escala de ruído, suave será o design. Então, se eu for até 2000, então você verá que as linhas são muito, muito mais suaves. Se voltarmos para 500, você verá que há mais rotações. E se descermos para 60 aqui do que há menos rotações. Então eu vou voltar para 100 e você pode brincar com ele como quiser. Além disso, você pode jogar com a velocidade ou os incrementos da velocidade do terceiro argumento no ruído. Então, algo assim vai criar mais rotações. E quanto mais lento for, criará muito menos rotação. Você também pode brincar com o comprimento aqui ou a contagem para os vértices. Então, se descermos para, digamos 16, será menos proeminente. E então, se voltarmos para 500, teremos mais vértices e você conseguirá ver o barulho um pouco mais. Este é, na verdade, um dos meus exemplos favoritos do grupo porque parece mais natural com o fundo do papel. Você também pode brincar com os diferentes planos de fundo que você pode encontrar no site ou em qualquer site. Você também pode fotografar seu próprio papel e adicioná-lo. Isso lhe dará mais caráter, especialmente se você criar algo mais como papel de diário com muita tinta e muitos adesivos e fita adesivos. Todos esses detalhes podem criar uma aparência natural para o seu trabalho gráfico. Agora isso é tudo o que tenho para essa técnica de textura. Em seguida, vamos falar sobre a próxima técnica de cores, e isso é usar imagens de fundo como forma de colorir seus gráficos. 6. Cor 22: cor a partir de imagens: Nesta lição, discutiremos a segunda técnica de coloração que eu quero mostrar a você e que está usando imagens como cor. Essa técnica é útil se você, digamos, tiver uma imagem que você criou no seu iPad, digamos no Procreate. E ele usou coisas como gradientes e pincéis que são um pouco mais suaves. Facilite a ferramenta de liquefy para mesclar as cores. Essa seria uma ótima imagem para usar e processar como entrada de cor para seus desenhos geométricos, que são um pouco mais duras, mas com cores como essa, pode elevar o design, o fim para eu, vou usar um dos meus projetos geométricos anteriores do curso de recursões. E vou usá-lo aqui para outro design geométrico. Então, ele vai dar uma aparência diferente. A primeira coisa que precisaremos fazer é importar a imagem para o processamento. E vou para a pasta. Você terá que salvar seu arquivo de esboço para chegar à pasta anexa. E então vamos criar uma nova pasta e um arquivo de esboço extra, e eu vou chamá-lo de dados porque é assim que você importa imagens aqui ou qualquer arquivo em vez de seu arquivo de processamento ou arquivo de esboço de processamento. E então eu vou pegá-lo. Coloquei aqui nos meus Downloads. E simples assim, chamei isso de imagem sublinhado 001 apenas para facilitar o acesso. E agora, se eu voltar aqui, podemos criar essa imagem carregada. Então, vou criar uma nova variável chamada imagem usando a classe PMF. E então aqui, vou dizer que a imagem vai carregar a imagem. Então carregue a imagem e isso leva o nome do arquivo. É por isso que é muito mais fácil se você tiver um nome de arquivo simples. E também vou redimensioná-lo porque se eu desenhar isso agora, então se eu fizer isso, imagine que você pode secá-lo usando o método de imagem. E então você terá que posicionar o canto. Se eu desenhar agora, vai ser enorme. Então, se eu quiser redimensioná-lo e vou ter que usar o método de redimensionamento dentro da classe pImage. E vou apenas fazer largura e altura. Agora mesmo. Eu sei com certeza que minha imagem ou a imagem que estou carregando é um quadrado. Portanto, não importa se eu apenas redimensioná-lo para a largura e a altura da minha tela porque ela não vai distorcê-la. E esta é a imagem real. Mas se você tiver uma imagem mais longa, vertical ou na horizontal, terá que redimensionar sua largura ou altura, dependendo da parte que você quer mais. E o resto será cortado pela tela. No entanto, não me importo se estou usando isso para cor. Não se importe em distorcer a imagem, destruindo-a basicamente apenas redimensionando-a para a largura e a altura da minha tela porque estou usando apenas em formas geométricas. Então, meu objetivo final não é mostrar essa imagem, o significado da imagem subjacente , mas para esta, será muito simples. Então, vamos redimensioná-lo para a largura e a altura. E agora temos a imagem perfeitamente ajustada à tela. E então a próxima coisa é pegar as cores de cada um dos pixels. Agora, a maneira como você pode obter qualquer cor desse design é usando o método get. Então, se eu disser imprima o que estiver nos anúncios de imagem MouseX e Mousey. E você tem que colocar MouseX e Mousey dentro da função de desenho porque precisávamos imprimir toda vez que eu mover o mouse, porque MouseX e Mousey, por quê? Vamos pegar os detalhes de onde o mouse está. Então, se você colocá-lo no lado da função de configuração, ela será executada uma vez e esse será o ponto zero zero. Então, se eu executar isso agora, podemos ver as cores mudando. E eu, se eu realmente desenhar, em vez de fazer dessa maneira, vou usá-lo como preenchimento e então vou desenhar um retângulo na dona de casa MouseX. Isso será, digamos, 30 por 30 pixels. E toda vez que ele for preenchido por este, veremos as cores mudando sempre. Assim, você pode ver a cor do retângulo muda com base em onde meu mouse está em qual pixel. Então, se estiver nos pixels laranja, então será laranja, rosa, rosa e assim por diante e assim por diante. Agora, na próxima seção desta lição, que é o exemplo. Então, vou mostrar um exemplo em que você pode usar algo assim. Então, criarei algo muito geométrico, e isso geralmente significa que eu usando uma grade. Então, criarei um método que vou chamar de grade. E isso exigirá uma contagem porque para essa grade, já que é um quadrado, vou precisar de uma contagem x e uma contagem branca. E essa será a contagem das minhas colunas e linhas. Então, a primeira coisa que eu criaria para uma grade é a altura do lápis da silhueta, conhecendo a contagem e a largura da minha tela. O primeiro valerá a pena. E eu serei a largura dividida pelo flutuador da contagem. Só para obter um cálculo mais preciso. Porque se eu não fizer isso, se você dividir a largura por um número indivisível pela largura, então você verá muitas lacunas. Mas ao converter isso em um flutuador, você está obtendo o cálculo correto ou mais preciso. E então isso será dividido em altura pelo flutuador da contagem. E, a propósito, você também pode criar guias. Podemos criar outro método que você pode chamar de guias. Se isso ajudar você. E dessa forma você pode ver como a grade está funcionando. O mesmo vale para este. Então, vamos criar os dois ao mesmo tempo. Então você pode ver como as coisas funcionam. E você pode criar uma função que os calcule juntos. E então você pode chamá-los dentro desses dois em vez de redefinir tudo. Mas eu prefiro assim apenas no caso de eu querer mudar os caras para outra coisa. E então j é menor que a contagem. Então j vai passar pela altura da tela, e eu vou passar pela largura. Então, ele criará as colunas para nós. E cabe a você se você quiser fazer. Primeiro digo que você quer passar pela largura da tela primeiro, os homens, a altura. Isso realmente não importa aqui. E então criarei as posições x e y. Então este será multiplicado pela largura da célula, e y será j multiplicado pela altura da célula. E então esses serão os guias. Então, isso é só para nós ver que tudo está funcionando bem ou tudo está onde ele deve ser posicionado. E às vezes é bom deixar esses guias. Ele pode dar um bom visual e vamos falar sobre isso mais tarde também. E agora, se eu desenhar o guia, então, em vez de tentar a imagem, vou desenhar os guias. E digamos que eu queira 10 linhas por dez colunas. Então eu recebo 10 linhas por 10 colunas. Então eu sei que minha grade está funcionando perfeitamente bem. Agora eu posso copiar isso e colá-lo aqui. E em vez de desenhar retângulos, vou desenhar linhas e arcos. Então, é como se o que eu estou tentando fazer é desenhar um caminho indo de um lado da tela e percorrendo linhas e colunas até chegar ao final da grade. E isso posso criar especificando alguns cenários. Então eu quero ir do canto superior esquerdo e então eu quero ir para a direita, e então vou passar uma linha para baixo e depois para a esquerda, e depois uma linha para a direita e assim por diante e assim por diante até a última célula na minha grade. Então, para esse cenário, sei que só estou girando na primeira coluna e na última coluna. Sabendo que posso escrever uma condicional if que verifica se é a primeira coluna. E então um else f que verifica se se encaixa no último. E isso será contado menos um porque vamos um menos do que a contagem, ou melhor, aqui. E, por último, minha declaração mais será todo o resto. Portanto, não é a primeira coluna, não é a última coluna, vai ser todo o resto. Então, para todo o resto, vou desenhar uma linha que seja a mais fácil. Então, vamos começar com isso. Vai de x e y. Então, da parte esquerda da célula. E então para y, porque eu quero que ele esteja no centro de cada uma dessas células. Então vou adicionar a isso a altura da célula dividida por duas. E então eu quero que ele vá para o lado direito de cada célula, modo que será x mais largura da célula E. E então para o último será o mesmo porque não quero que seja uma linha diagonal, quero que seja horizontal. Então, será a mesma coisa. Então, a altura da célula dividida por 2, então y permanecerá o mesmo. X vai da esquerda para a direita. E se eu executar isso, eu deveria ver as linhas se eu realmente chamar Greg. Então, vamos chamar gerd. E farei a mesma contagem. Podemos apenas para garantir que toda vez que os guias forem iguais à grade, vou definir a contagem aqui. Vamos fazer dez minutos de argumentos estúpidos aqui com a contagem de variáveis. E agora podemos ver que a primeira coluna não tem nada porque nossa condicional F está vazia. E então a condicional elsif está vazia para a última, mas então as do meio, que é tudo o resto, tem uma linha que vai horizontalmente da esquerda para a direita e é centrada verticalmente dentro de cada célula. Agora, para o primeiro, o último, eu sei que quero desenhar arcos para virar. Então, será um quarto de círculo para virar de uma linha para outra para cada célula. Então, será meio círculo para ambas as células, mas teremos que desenhar um quarto do círculo e depois um quarto do círculo para a outra célula. Portanto, há dois cenários para a primeira coluna e, em seguida, há dois cenários para a última coluna, e isso é linhas ímpares e linhas pares. O primeiro que vamos fazer é e até remar. E isso é se j módulo 2 for igual a 0, ou seja, se o restante da divisão j por dois for igual a 0, o que significa que J é divisível por dois, então isso será uma linha par ou um número par, o que significa que é um linha par. E então, se j não for par, então o restante de dividi-lo por dois não será igual a 0, então ele nos dará as linhas ímpares. Então, se eu copiar e colar este, será o mesmo para ambos. A única diferença é que como vamos desenhar os arcos. Então, falamos sobre o nosso x na lição anterior ou na lição de cores anterior. E sabemos que para arco nos dois primeiros argumentos será a posição X e Y de seu centro. Então, se for um círculo completo, então o centro será nosso x e y. Então eu quero o centro para este, para cada um dos pares. Então 0 será considerado uma linha par para os pares não serão o segundo amanhã que vemos visualmente, mas será a terceira porque vamos 01234. Então, isso é mesmo, isso é par. E então isso é estranho. Então eu sei que quero que ele vá porque sei que estou começando aqui, então eu sei que quero que ele vá por esse caminho. E depois indo para cá, vamos por aqui e depois vamos virar. E depois indo para cá, vamos por aqui. Então eu sei que estes vão ser meio círculo para o primeiro. Na verdade, você pode desenhar uma linha, mas elas serão ainda mais condições que você pode adicionar ao seu loop for-ou que você terá que adicionar ao seu loop for. Então, vou deixá-lo como uma curva ou um arco que vai subir. Então, isso será x mais a largura da célula porque esse é o canto superior direito. E então vai ser y porque não estamos nos movendo para lugar nenhum verticalmente. E então teremos que definir um raio. Então, farei um círculo. Então, para largura e altura, vai ser R. E eu definirei r aqui. Então r será o valor mínimo de largura e altura da célula. Apenas no caso de eu querer transformar isso em uma grade retangular. Isso garantirá que sempre terá círculos para arcos e não o esticará por toda a tela. Porque então nós vamos para esses diferentes e eles vão ser elipses. E não vai ficar bem, a menos que seja esse o visual que você está procurando. Então, vou apenas pegar o valor mínimo, seja a largura da célula ou venda alta, dependendo da tela, se você quer que seja vertical ou horizontal, mas menos quadrado. Então, isso realmente não importa agora. Então, você pode especificar a largura da célula e isso ficará bem. E agora sabendo que o arco começa ou um círculo começa a cair do lado direito. Então, pensando nas duas linhas perpendiculares umas às outras no centro, sabemos que acima é norte e depois para baixo é Sul. Então, a taxa será Leste e a esquerda será Oeste. Então, vamos começar do lado leste. Mas eu sei que não vai de 0. Então, ele vai começar do ponto sul. E o ponto Sul será meio Pi porque estamos nos movendo de 0 por quarto do círculo e isso é metade Pi. E então eu vou para o lado oeste do círculo, então isso será tubo. Agora vamos executar isso para garantir que tudo esteja funcionando perfeitamente. Como você pode ver, os arcos estão secando bem. E vamos mudar a cor disso para que possamos vê-lo e podemos ocultar os guias agora, ou podemos colorir algo diferente. Então, digamos que agora filme e, em seguida, o traço fará com que seja 0 a 50 transparência. E então aqui, vou fazer o peso do AVC. Vamos fazer o peso do traçado variável. Então vou fazer a largura dividida pela contagem multiplicada por dois. Apenas um número arbitrário. É o que eu calculei e é o que eu mais gosto. E então também faremos a tampa do traçado. E vou fazer esse quadrado. E vamos deixá-los pretos por enquanto. E em vez de definir nenhum preenchimento aqui, e em ambas as funções, vou fazer isso aqui. Agora, se eu executar isso, devemos ver um visual mais agradável. Agora, para os estranhos aqui, queremos que ele feche essa lacuna. Então, isso será célula x mais com 10 e y mais altura da célula. Este é o centro. E então, para o raio, será o mesmo sempre. E agora vamos de saber que este ou o círculo gira no sentido horário, teremos que ir de 0 a meio Pi, mas não precisamos disso. E então vamos para pi. Ainda assim, não precisamos disso. Então, vamos de pi para pi mais meio Pi. Então, metade do círculo mais mais um quarto. E recomendamos que você experimente arcos se sentir que não está fazendo nenhum sentido. Mas basta notar que metade pi é um quarto de círculo, pi é metade de um círculo. E isso quando você desenha um RQ, vá no sentido horário. E então, se eu executar isso agora, e eu realmente fiz esses dois eventos, então não vai funcionar. Então agora temos nossas linhas pares Rosen são ímpares e elas estão funcionando. Ótimo. Agora vamos fazer a última coluna. Então, para a última coluna, estamos indo por esse caminho. Então você vai ter que ir por esse caminho. Então esse ponto é x, e então y está indo a altura total. Então, será y mais a altura da célula, então o raio permanecerá o mesmo. E agora desde os centros aqui, vamos de meio pi mais pi para dois pi. E a razão pela qual estou dizendo duas tortas porque estamos realmente indo um círculo completo em vez de dizer 0, que vai retroceder. E se eu executar isso, você deve ter o segundo a último. E agora mais o último. Vamos ter o centro em x e y. e então este será o raio. E finalmente vai passar, já que este é o centro, vai de 0 a meio Pi, então apenas um quarto de círculo. E agora executando isso, temos um design completo. Agora, para a parte mais importante, e isso é colorir usando a imagem que adicionamos ou recarregamos. E, como sabemos até agora, podemos fazer isso usando o GetMethod. Então, o que eu faria é pegar a imagem usando o método get. Vou usar a posição x e y. Mas porque eu quero o centro dessa grade ou o centro das células e do migrante. E vou ter que adicionar metade da largura da célula ao x e depois metade da altura da célula ao y, apenas para ter certeza de que estou obtendo qualquer cor no centro de mim. E agora get vai reclamar que precisa de números inteiros e estes são carros alegóricos. Então, vou ter que encapsular isso em um método int. Só porque o elenco não funcionará aqui, já que temos uma fórmula. E em vez de, então teremos que lançar x sozinhos e então a célula estaria sozinha, ou você terá que encapsular entre parênteses, e então isso estará entre parênteses. Isso é demais, então podemos usar os métodos e convertê-los. É muito mais curto. Agora, se eu executar isso, devemos obter as cores da imagem. Agora, se eu mostrar a imagem, você pode ver um pouco isso onde quer que as linhas e arcos estejam lá, pegando a cor do centro dessa célula. E para garantir que estamos realmente pegando as cores da imagem, há uma maneira de certificar isso criando uma animação. E acho bom ver como as cores estão sendo capturadas das imagens dinamicamente. Então, a maneira como você pode fazer isso é deixando a contagem assim, porque agora ela é por padrão inicializando para 0. Então, se eu só for aqui e então eu conto mais, além de aumentá-lo em um. E então eu pego que estes, na verdade não significam mais os guias porque eles têm a imagem. E agora toda vez que isso estiver sendo incrementado, ele vai pegá-lo aqui e o melhor será atualizado com base na contagem. E então também teremos que redefinir o plano de fundo. Também vou torná-lo uma cor mais escura porque é melhor com as cores que tenho. E vou reduzir a taxa de quadros porque isso vai ser ofuscante. Então, faça-o às 24. Você pode até torná-lo menos. 12 seria bom, mas parecerá mais um stop motion, qualquer movimento, e apenas certificando-se de que tudo seja desenhado corretamente. Agora podemos executar isso e você pode ver a imagem revelando-se quanto mais células temos. Porque vai se assemelhar a aumentar a resolução da tela. Então, ter mais pixels, o que significa ter uma imagem mais nítida. E isso é basicamente o que é isso. Mas agora temos um design muito bom. Assim, você também pode salvar essa animação para mostrar às pessoas a imagem subjacente de onde suas cores estão vindo. Ou você também pode compartilhar capturas de tela de seus favoritos. Então, meus favoritos geralmente são os que têm dois. Então, se eu fizer algo assim, posso usar em qualquer trabalho de design gráfico. Ou até mesmo um pode ser algo que você pode usar. Eu realmente uso isso em código com meu vídeo no YouTube, onde adicionei títulos no final do vídeo em um quadro como este, mas um que é horizontal para que ele se encaixa no vídeo. Mas, geralmente, gosto mais da animação porque ela mostra a imagem ou a imagem subjacente no final. E se você quiser salvar isso, você pode dizer se a contagem ou você pode usar a contagem de quadros é menor ou igual, digamos que 120 com base nas taxas de quadros e no número de quadros. E vou usar um quadro e vou colocá-lo dentro de uma pasta de saída. E sabendo que vamos parar em três dígitos, precisamos de mais de três hashes e, em seguida, PNG ou JPEG dependendo do formato que você gosta. E por outro lado, vamos sair. Então, isso salvará as imagens e, em seguida, ela sairá ou fechará a tela anterior. Então isso está pegando cores das imagens. Na próxima lição, vamos falar sobre outra técnica de textura e isso é adicionar seus guias como elementos de design ou simplesmente adicionar elementos de fundo para elevar seu design ou adicionar interesse visual a ele. 7. Textura 03: elementos de fundo: Nesta lição, trabalharemos em um exemplo porque já criamos para isso, implementamos. Essa técnica é um pouco semelhante à segunda. O segundo era sobre adicionar uma imagem de fundo. Embora isso se trate de adicionar elementos de fundo como guias ou textura e detalhes como poeira falsa e arranhões. Na segunda técnica de texturização, eu combino duas grades no topo, a imagem de fundo para imitar papel gráfico, especialmente porque estamos usando uma imagem de papel real em segundo plano. Também parecia a escolha natural de adicionar um gradiente primeiro lugar para mostrar por que o design está se comportando da maneira que está. Para mostrar que os limites de venda podem encontrar cada agente, respectivamente. No entanto, para este outro exemplo, revelar os guias é desnecessário. Adicioná-lo pode aglomerar o design ou até mesmo arruiná-lo, já que estamos pegando cores de uma imagem, quanto mais células, mais as guias podem estar dificultando. Imagine o fundo da sua área de trabalho em todos os pixels, bordas em branco ou preto, a imagem não ficará bem no nosso caso, no entanto, os designers impactam com pixels para que possamos adicionar guias sutis, como pontos nas células, bordas parecido com papel pontilhado, como aqueles diários de bala que estamos vendo lá fora. Ele expõe a grade subjacente sem dominar a arte final. Este exemplo que criará a seguir nos dá a sensação de caos. Embora quando mostro os guias, exponho que é realmente ordenado o caos. É grau imune com formas deslocadas aleatoriamente. Para este exemplo, revelar o detalhe do plano de fundo é sua escolha, dependendo da reação desejada de mostrá-lo a outras pessoas. Por exemplo, neste exemplo, usar números que revelam a grade subjacente dá ao visualizador uma visão sobre o design adicionará um tipo de elemento gráfico. Isso mostra que eu criei isso usando uma grade enquanto ofereço a abordagem de fazer a nota que eu não usei loops aninhados que poderiam ter exibido números duplicados. Você também pode adicionar elementos de fundo que são apenas para fins de design. Este exemplo usa arranhões aleatórios para imitar imperfeições de papel. Ideia de bromo para adicionar textura a um design. Não parece proeminente de longe, mas ainda é visível no visual geral, especialmente quando impresso em papel comum. Também para visualização de dados, mostrar alguns dos elementos de fundo relacionados às informações pode ser muito útil para o observador. Confira Nicholas Felton, trabalhe para algumas ideias em seu site caiu Tron.com. Há vários exemplos dos relatórios anuais que eles criaram ao longo dos anos, alguns dos quais são criados usando o processamento. Verifique também suas aulas de escultura e design de informações com processamento, incluindo design gráfico e dicas de codificação relacionadas ao assunto. Agora é sua hora de pensar em maneiras de adicionar textura ao fundo ou até mesmo primeiro plano simulando arranhões ou partículas de poeira em uma lente da câmera. Isso definitivamente pareceria muito legal. Tentei descobrir maneiras de trazer o mundo físico para a tela do seu computador. Isso é tudo o que tenho para esta lição. Se você tiver mais ideias, compartilhe-as na discussão ou até compartilhe-as em seus exemplos para seus projetos. Eu adoraria vê-los. Em seguida, falaremos sobre um conceito muito interessante de colorir nosso design usando uma técnica semelhante à detecção de colisão agarrando empresas de cores e vizinho mais próximo. 8. Cor 03: cor por distância: Nesta lição, falaremos sobre a terceira técnica de coloração. E para mim este é um dos mais interessantes que aprendi e li sobre isso em um dos artigos do Tyler hubs. Ele acabou de explicar. Não há códigos. Comecei a experimentar e encontrar minha maneira de fazer isso. Portanto, essa técnica de coloração é semelhante à detecção de colisão. Eu chamo essa técnica de coloração por distância porque ela verifica o agente mais próximo ou agente colorido de um objeto e usa essa cor pode produzir algo semelhante a uma textura Voronoi com cor. Para conseguir isso, vamos continuar a partir da cor um exemplo ou do primeiro exemplo de técnica de cor, o de interpolação de cores. No entanto, vamos mudar algumas coisas. Então, vamos precisar de agentes. E os agentes serão posicionados da mesma forma que este está posicionado. Para este, no entanto, vamos mudar o comportamento de um agente, e também vamos mudar o construtor um pouco. Então, em vez de aleatoriedade, vamos criar uma grade para isso. Vou adicionar dois argumentos para o construtor do agente. Então, quando criamos uma instância da classe de agente, podemos decidir a posição dela então. Então, no loop for que criará a grade. Então, para isso, vamos fazer sublinhado flutuante x e sublinhado flutuante y. E então eu vou mudar esses dois para ser x, que é nosso nativo dentro da classe, igual a qualquer que o parâmetro x aqui seja igual. E então, para o raio, também vou inicializá-lo mais tarde, dependendo do tamanho da célula. E vamos fazer a largura do traçado três porque não precisamos que ela seja enorme. E então não precisaremos de um ângulo em uma velocidade porque ao longo da mesma forma que costumávamos atualizar o anterior. E não precisaremos da cor 1 e da cor 2 porque vamos usar um agente diferente para colorir essas cores que serão aleatórias. Então você pode manter um dos CO2 de quilowatt-hora e depois renomeá-lo para cor porque foi isso que eu fiz basicamente. E então eu posso remover isso daqui. Também posso remover isso. E então porque estamos desenhando círculos principalmente para não precisamos da taça, porque não vamos ver nenhuma tampa de qualquer maneira. E vou manter esses iguais e também remover tudo isso. Agora, basta ter um círculo e XY. E ele terá um raio. Na verdade, em vez de raio, vou renomear isso para tamanho. Portanto, não é confuso como anteriormente. Tamanhos, basicamente o diâmetro do círculo porque círculos e elipses são desenhados usando o diâmetro, não o raio. E não precisarei da atualização para o collide. E agora, em vez de ter o peso do traço constante, vou fazer com que o tamanho seja dividido por oito. E isso, ou adicionar pontos 0, faz com que seja um flutuador. Em vez de apenas fazer o que eu faço geralmente assim. Porque é um número, posso facilmente colocar 0 e depois transformá-lo em um flutuador. Então isso me dará um cálculo mais preciso. A próxima coisa que vou fazer é sair aqui. E em vez de uma ArrayList, vou usar uma matriz regular. Porque eu quero especificar o número com base na contagem que eu especifico para uma grade. Vou fazer isso valer a pena. Então eu posso apenas fazer inteiro, não posso. Na verdade, isso vai ser contado multiplicado pela contagem porque eu quero a área. Enquanto aqui, a contagem representará o número de linhas e o número de colunas. Então, digamos que eu queira que o 10 comece. Certo, então vamos no topo e vou explicar o que estou tentando fazer aqui. Portanto, o agente não será simplesmente os agentes que vamos ver na tela como antes. Serão os agentes que vemos e o agente nos bastidores que serão a fonte de nossas cores. Então, no começo, escolhi uma cor aleatória, mas não é isso que vamos usar para nosso agente. Então, essas serão as cores dos nossos agentes de cor. Vamos ser invisíveis. Agora, sabendo disso, posso criar outro array de agentes. No entanto, este será o agente de cor. E a contagem dessa matriz para a matriz de agentes de cor dependerá da quantidade de cor que você deseja que seu design tenha. Então, se eu disser novo agente e eu colocar apenas cinco cores, então você descobrirá que a maioria em determinadas áreas terá uma cor porque há apenas cinco agentes para pegar cores. No entanto, se eu colocar 50, então obterei mais variação na cor. Então, vamos começar com cinco e vamos exibi-lo. Então, agora podemos realmente excluir tudo isso. Não temos uma atualização porque não vamos mover nada. Agora vamos começar a inicializar agentes aqui. Então eu farei para inteiro I ou para inteiro n, porque vou usar I e j litro igual a 0 e n é menor que o comprimento do ponto dos agentes. E agora eu vou dizer n modulo count. Então, ele vai de 0 para contar. Então aqui estão 10, que vai de 0 a nove. E então o inteiro j é n dividido por contagem. Então, está fazendo é obter o restante da divisão e por contagens vai de 0 a nove e, em seguida, novamente de 0 a nove. Então, ele vai passar por todas as linhas porque j está sendo dividido por contagem. Porque o que quer que n seja no momento, dividi-lo por contagem vai passar pelas fileiras. E agora posso dizer para os flutuadores x, para a posição x, será multiplicado pela largura da célula. E então para y será j multiplicado pela altura da célula. E se inicializarmos ou antes de fazermos isso, vamos passar aqui e fazer a largura e a altura da célula para defini-la. E depois aqui. Então, a largura será dividida por flutuação de contagens, como fizemos antes. E, em seguida, a altura da célula será dividida pela contagem de flutuadores. No entanto, também quero margem, ou gosto de ter uma margem em todos os momentos. Então, vou cortá-lo daqui e colocá-lo aqui em vez disso. E então vou subtraí-lo da largura. Então, a razão pela qual estou dizendo que a margem multiplicada por 2s, porque o que eu defino como uma margem é apenas um lado dela. Então, da largura, preciso de um à esquerda e outro à direita. Então, vamos ter que multiplicá-lo por dois para obter o dobro disso. Então eu posso subtraí-lo da largura e da altura. E então aqui, vamos precisar empurrá-lo. Mas antes de fazermos isso, quero mostrar primeiro como o subsídio parece. Então podemos empurrá-lo pela margem. Agora, podemos dizer agentes. Eu ia igualar novos agentes. E o construtor requer uma posição x e uma posição y e um tamanho. Então, vamos também inicializar o tamanho aqui e vou tornar o kit o mínimo, seja a largura da célula ou a altura da célula, para garantir que sempre tenhamos um círculo, especialmente que o definimos como um círculo aqui de qualquer maneira. Então, se você tiver, agora não teremos um problema porque temos um quadrado para Canvas. No entanto, se tivermos uma tela vertical ou uma tela horizontal, isso nos ajudará a obter apenas quadrados ou círculos. E agora nós o exibimos aqui. Então, se eu executá-lo, oh, eu deveria tê-lo como n aqui. Agora, se estivéssemos nele, podemos ver os círculos. E foi aqui que eu disse que teremos que empurrá-lo. Então, agora, porque excluímos ou subtraímos, o dobro das margens da largura. Agora temos 100 pixels aqui. Então, se eu empurrar isso por margem, apenas adicionando margem a ele, isso vai empurrar a coisa toda para a direita e para baixo. Então você pode ver as grades perfeitamente. Também vou desenhar retângulos ou quadrados na posição x e y por tamanho e tamanho. Então, também vamos precisar, para você possa ver por que não é o mesmo aqui. E aqui. Porque estamos desenhando como se os círculos estivessem sendo desenhados do canto esquerdo ou superior esquerdo. Enquanto eles estão realmente sendo atraídos do centro. Assim, você pode alterar o modo de elipse para canto ou simplesmente adicioná-lo aqui. Então eu posso simplesmente adicionar tamanho dividido por dois. E aqui, tamanho dividido por dois. Podemos escolher célula com ou vender altura. Qualquer um vai ficar bem. No entanto, pelo mesmo motivo que falamos antes, vou usar isso porque ele vai me dar o mínimo, seja a largura da célula ou a altura menor. Então, ele sempre se encaixa dentro das minhas células II. Na verdade, em vez de fazer isso aqui, vou fazer isso aqui. Ou você pode fazer isso dessa maneira apenas para mantê-lo limpo para garantir que ele só esteja sendo adicionado depois que tudo isso estiver sendo criado depois que o médico tiver sido estabelecido. E a razão pela qual eles não estão alinhados com os retângulos. Círculos foram empurrados. No entanto, eles não estão alinhados com os retângulos porque os retângulos estão sendo desenhados do canto. Então, vamos ter que fazer, só para que possamos ver que está funcionando bem. Eu posso apenas fazer o Centro para o modo retângulo deles. E agora podemos ver que ele se encaixa perfeitamente. Então, não vamos mais precisar dos retângulos. Era só para nós podermos ver que nossa grade está funcionando bem. Então, a primeira largura do traçado, podemos torná-lo ainda menor dividindo-o por 12 porque agora está sobrepondo tudo ou por 15. E também vou redefinir o plano de fundo para que não vejamos linhas tortas Bs. Agora está muito mais limpo e vou aumentar a contagem e diminuir as margens. Então, mais margens, vou mantê-lo em 20. E então, para este, vou fazer 50 ou talvez um pouco maior. Porque preciso de mais círculos para ver como eles estão sendo coloridos. Agora, para os corantes, vou inicializá-lo em um loop. Então, para este, porque vai ser aleatório, vou duplicar o construtor e criar outro que não tenha nenhum desses. E vai ser aleatório entre largura menos margem também, ou entre margem e largura menos margem. E o mesmo vale para y. E então isso também, vou torná-lo aleatório entre 35 e mais aqui. Agora posso usar agentes na posição que vou igualar um novo agente. E esse será o construtor vazio. E se eu exibir isso aqui, então você pode simplesmente mudar os agentes de cor e ele vai pegar cada um e ele irá exibi-lo. Eu fiz agentes em vez de agentes de cor. Então agora, se eu apenas para inicializá-lo, podemos realmente vê-los no topo. Então você pode vê-los, eles são muito pequenos. Então, se eu apenas aumentar o tamanho para algo como 10 a 50, e na verdade não precisamos que eles sejam tão aleatórios, então eu vou apenas torná-los 20. E agora podemos tê-los invisíveis apenas nos certificamos de que eles estão lá. E cada um tem cores diferentes. Vou manter isso como um guia, então não vou removê-lo para que eu possa descomentá-lo sempre que quiser. Então, digamos que se eu adicionar 50, quero ver como ele se parece. Posso comentar e ativar este. Agora temos nossa grade. Ok, outra coisa que eu quero fazer é não apenas obter a largura da célula e vender a altura, eu quero que ela seja menor. Então, digamos que eu queira dividi-lo por 1,5. Então eu posso compensá-lo. E agora posso voltar ao tamanho e mudar isso para oito porque eles não vão se sobrepor. Então eu posso vê-los melhor. E eu posso compensar isso por um valor aleatório. E esses valores aleatórios serão. De 0 ao tamanho dividido por dois. Então você pode vê-los, eles são um pouco mais aleatórios e parecem um pouco mais interessantes. E também fazemos a altura, ou a posição Y. Agora temos um pouco mais de variação e o design, vamos voltar à cor, o que é mais importante agora que temos nosso design estabelecido, vamos criar nosso método de transferência de cores. Então, dentro da nossa classe de agentes, vou criar um método que chamarei de tomar cor ou chamar. E vai precisar de outro array de agentes. Então vou ligar para os agentes. E tudo isso vai retornar uma cor. Agora, o que vamos fazer aqui é pegar a matriz de agentes que têm cores neles que usaremos para colorir um design com base na distância desses agentes. Então, vou combinar toda a distância dentro de uma matriz ou de um dicionário. E então eu vou, então vou peneirar todos esses agentes coloridos. E então vou verificar qual deles tem a menor distância de qualquer um dos meus objetos. Então, o que estiver mais próximo do meu objeto, essa será a cor do meu objeto. Para fazer isso, vou usar um dicionário flutuante. Vou chamá-lo de digests. E então inicializá-lo é tão simples quanto fazer isso. E então vou percorrer todas essas distâncias ou todos os agentes e verificar a distância. Cada vez, vou verificar a distância entre x e y e os agentes x e y. E agora isso será definido dentro da matriz ou do dicionário. Então, a maneira como você pode fazer isso é apenas ligando para nós e depois chamando o método set. E o método set adquire uma chave. Então, vou dar o índice e, em seguida, ele vai tomar a distância como o valor. Portanto, essa é a chave para o dicionário e esses são os valores para os dicionários. E a razão pela qual estou usando um dicionário é porque ele tem um método de valores de classificação que 18 anos. E isso vai classificá-los em ordem crescente. Dessa forma, posso pegar o primeiro, e esse é o meu agente de cor mais próximo de qualquer objeto especificado no momento. Então, vou pegar todas as chaves. E você pode pegá-los usando o array de chaves. E então vou devolver o agente no CHI 0 e vou pegar a cor disso. Isso é um bocado. No entanto, se você tomar passo a passo, é muito fácil de entender. Então, o que estou tentando fazer é pegar todos os agentes de cor, verificar sua distância com qualquer agente que eu esteja especificando. Então eu posso chamar isso de cor na matriz do agente que tenho aqui, que é essa. E então, para cada iteração, vou verificar a distância entre esse agente na matriz de agentes de cores. E então vou pegar todas essas distâncias, colocá-las dentro do meu dicionário flutuante, e então vou classificar os valores em ordem crescente para obter o agente de cores mais próximo do meu agente. E então vou pegar as chaves desse dicionário para que eu possa obter o agente na primeira chave ou na chave na primeira posição da matriz e de um dicionário. E então eu vou pegar a cor disso. Então essa será a cor do agente de cores mais próximo do meu agente. Agora, se eu voltar aqui, posso usar isso dentro da minha matriz. Então eu posso fazer isso dessa maneira. Cor do ponto do agente. Assim, eu posso pegar a cor do agente e posso atribuí-la aos agentes ponto-ponto tirar cor do ou em loop através da matriz de agentes de cor. Então, isso executará o que acabamos criar em todos os agentes dentro da matriz de agentes. E então ele vai defini-lo para sua cor. Agora, se eu executar isso, devemos obter resultados completamente diferentes. E agora, se você quiser ver os agentes de cores apenas para ver como isso está funcionando, você pode exibi-lo e ver que este é o mais próximo deles, então ele tem essa cor. No entanto, para este, eles estão mais próximos disso, o, É por isso que eles têm a cor laranja e assim por diante e assim por diante. E como eu disse, se você quiser ter apenas cinco deles, você terá menos variação de cor porque há menos chances de algumas cores aparecerem, já que temos apenas cinco cores na primeira lugar e você está obtendo uma cor aleatória. Então, neste momento, não temos um rosa, temos dois amarelos em vez disso. Ou você pode até escolher a probabilidade de escolher uma cor sobre a outra na sua escolha de cor aleatória. Mas o jeito que eu gosto de fazer isso é apenas adiciona 50 e dessa forma eu posso obter mais variação de cores. E se você exibir isso, você pode ter mais cores. Então, se eu voltar para cinco, podemos ver que temos menos variação de cor. Ainda é um visual bonito, mas se você quiser que todas as cores apareçam, você terá que mudar a probabilidade de certas cores aparecerem mais do que outras. Ou você pode adicionar mais agentes para os agentes de cor. Então, quanto mais você adicionar, mais variação de cores você terá. Então, se você fizer isso muito maior, e então podemos adicionar mais. Você pode ver o design muito melhor. Na verdade, dá a você um tipo de textura Voronoi. Quanto mais cores você tiver em sua matriz, mais você poderá vê-lo. Além disso, se você alterar o traçado aqui para preencher. E sem derrame para este, você pode realmente vê-lo melhor. Portanto, isso é semelhante à coloração usando uma imagem de fundo. No entanto, ele pega a cor do agente de cores mais próximo em vez de apenas pegar qualquer pixel embaixo disso. Mas se você tiver um design que você criou para usar seu iPad ou seu tablet Wacom ou qualquer tablet que ele seja uma largura de caneta. Em seguida, você pode criar gradientes ou formas geométricas, apenas preenchendo a tela com cores e usando-a como uma imagem de fundo para colorir seu design. A maneira como você pode obter mais variação de cores sem aliviar algo assim, por exemplo. É isso para essa técnica de coloração. Em seguida, vamos abordar a quarta técnica de texturização e isso está adicionando sombras ao seu design. 9. Textura 04: sombras para queda: Essa última técnica de texturização também é muito simples porque adicionaremos sombras simples aos nossos projetos para criar alguma profundidade em nosso trabalho. Para mostrar o que quero dizer com uma simples sombra. Vamos criar dois círculos. E também já adicionei a cor e o plano de fundo. Então, se você quiser tirar essas cores, sinta-se à vontade para fazê-lo. Se você quiser usar suas próprias cores, eu realmente o encorajaria. Agora vamos criar a sombra simples. Fará isso facilmente criando dois círculos. Agora, o primeiro círculo será a sombra porque o que vier primeiro estará abaixo do segundo. Então, isso será, digamos, largura dividida por dois. altura dividida por 2 deve estar no centro. E então vamos dar a ele uma largura de 100. E então o mesmo vale para este. A única diferença é que aquele na parte inferior será deslocado um pouco. Então, desloque-o apenas para a direita ou você pode deslocar para a direita e para baixo onde quer que você escolha a luz que vem deles, basta ir em frente a isso. Então eu estou escolhendo a luz para vir do canto superior esquerdo. Lembre-se também que esta é uma sombra muito simples, por isso não é realista. Isso só nos dará profundidade em nossos projetos. E agora para diferenciar entre os dois, vou dar a isso um preenchimento de preto. E essa falta de, digamos que uma das cores. Então, darei a primeira cor. E não vamos fazer nenhum golpe por enquanto. E isso é basicamente o que quero dizer com uma simples sombra. Então podemos diminuir isso, digamos que faça cinco. E dessa forma adicionamos um pouco de profundidade. Agora, isso não funcionará aqui muito bem. Mas para a classe que vamos criar, quando o design estiver completo, você verá uma pequena diferença quando se trata das profundezas do seu design. Então, vamos remover tudo isso por enquanto e começar a criar a classe. Então vou chamar essa classe de espiral. Porque vamos criar uma forma espiral. A primeira coisa que vamos precisar para essa forma espiral é a posição principal X e Y. E isso será flutuador x e y. E porque uma espiral é basicamente um círculo que se move para criar círculos concêntricos. E para nos movermos em círculo, vamos encontrar vários componentes. E esses são o centro x, o centro y, o raio e o ângulo de partida. Então, vou apenas criar esses centro x, centro. Por quê? E então comece o raio e um ângulo. E agora inicializarei o raio de partida e o sotaque central para y e o ângulo que você está primeiro raio inicial. Vou torná-lo um valor aleatório de, digamos de dez a 30 para o raio inicial será o círculo inicial nesta espiral. E então o centro x está chegando a ser um valor aleatório será a partir do raio inicial dois com rádios de início menos. E então para o centro, por quê? Vai ser exatamente a mesma coisa, mas com altura. E, finalmente, para ângulo, será um valor aleatório de um a cinco. Isso realmente não importa. E a razão pela qual estou aleatorizando o ângulo ou inicializando e ouve, porque se eu não fizer isso e começar a criar a espiral, todos começarão do mesmo ângulo. Então eu preciso de um pouco mais de variação em cada uma das espirais. E você pode conseguir isso aleatorizando o ângulo inicial. Vamos exibir a espiral. Para criar a espiral, vamos desenhar pontos ao redor do círculo, mas o círculo ou o raio desse círculo aumentará e isso criará a espiral. Então, para isso, você pode usar pontos e, em seguida, usar um peso de traçado para o tamanho. Mas aqui eu vou usar uma elipse vai estar em x e y, e então ela terá um tamanho. Então, também inicializarei um tamanho. E depois adicionarei uma cor. Já temos uma variedade de cores. Então, vou usá-lo aqui. Também será uma cor aleatória. Também definirei nenhum derrame aqui. Em vez de colocar aqui. E, finalmente, teremos um método de atualização. Então, no método de atualização, vamos aumentar o ângulo para que ele se mova. E então também criaremos nossos valores x e y. E eles vão usar o cosseno do ângulo B, B Ângulo crescente. E então y será o seno do ângulo. E então vamos multiplicá-lo pelo raio. E, finalmente, para empurrá-lo para onde precisarmos, teremos que adicionar o centro x e o centro y. Então, o epsilon y definirá a posição da elipse que está secando em torno de um círculo. E então o raio inicial definirá o raio desse círculo. E então o centro x e o centro y definirão o centro desse círculo e o ângulo aumentará. Isso vai desenhar o mesmo círculo repetidamente ao redor do ponto central. Então, o que precisamos fazer é aumentar o raio de partida. Então, também vou incrementar o valor que chamarei de tinta. E vou defini-lo aqui em cima. E então vou adicioná-lo ao raio de partida. Mas precisamos fazer isso antes da multiplicação. Então eles vão até aqui e criam uma instância de uma espiral de morte. Pode ver como está realmente funcionando para criar uma nova espiral. E, em seguida, dentro da avaliação novamente, exibiu uma atualização. Então, a captação de glenn de exibição de pontos em espiral porque esqueci de inicializar o tamanho. Então, o tamanho será um valor aleatório no chute de 5 a 7. E agora podemos ver o início de um círculo. Então, isso terá um raio de partida e, em seguida, à medida que se move, aumentará o raio, então cria uma espiral. Agora isso é divertido e tudo mais, mas acho que parecerá ainda mais interessante se adicionarmos um pouco de ruído a esse movimento. Então, em vez de criar círculos perfeitos, vamos adicionar alguma distorção. Então, se eu voltar aqui, posso adicionar dois valores e chamarei uma distorção X e a outra linha. E antes da inicialização x e y. Inicialize a história x para ser barulho. E vamos torná-lo x dividido por um 1000. E então usarei ângulo para o segundo. E depois para o armazenamento. Por quê? Vou fazer barulho e vamos fazer a balança um pouco diferente. Então vou fazer 3000 para este. E então usaremos o ângulo para o segundo ou mesmo ângulo, multiplicá-lo por 0,5, digamos apenas para alterá-lo um pouco. E posso acrescentar isso ao ângulo. Então estou distorcendo e continuo escrevendo esse cinza porque na verdade está destruindo o ângulo perfeito para esse círculo. E então vou adicionar distorção y à posição y aqui. Agora, se eu executá-lo, e você pode ver que há um pouco de ruído na espiral porque adicionamos essa distorção aqui. Isso dá uma sensação mais natural. Então, parece que alguém está realmente tentando à mão. Você também pode fazer os dois iguais em termos da segunda dimensão do ruído. E isso não vai destruí-lo tanto. Então, ele ainda manterá a forma circular e não se tornará mais como uma elipse. Então, cabe a você como você quer distorcer a imagem. Então, vamos mantê-lo assim. Mais uma coisa que podemos adicionar a esse método de atualização é variar a direção do ângulo. Então, agora, tudo está indo no sentido horário. Podemos movê-lo para ir no sentido anti-horário também. Mas veremos isso se criarmos uma série de espirais. Então, vamos criar uma matriz. Vou dar uma contagem de 10. Isso está chegando ao interior do lábio. E o mesmo vale para este. Agora, se eu executar isso, vamos ver várias espirais. Então, como você pode ver, todos estão indo no sentido horário. Altere isso. Vou criar outra variável que vou chamar, portanto direção. E então ele terá um valor aleatório de 0 a um. E então eu darei a ele uma probabilidade de 50% de ir no sentido horário. Portanto, se a direção for maior ou menor que 0,5 porque 50% é metade. Caso contrário, preciso que o ângulo vá na direção oposta. Mas vou fazer com que seja a mesma velocidade. E agora, se eu executar isso, você verá que alguns deles vão no sentido horário, enquanto alguns outros estão indo pelo contrário. Então este está indo no sentido anti-horário, sentido anti-horário, e estes estão indo no sentido horário. Agora, a parte importante é criar as sombras para criar a profundidade. Então, como você pode ver, isso é muito 2D. E para fazer isso, vou criar outro método que vou chamar de gráfico. Então isso vai ter um deslocamento, uma cor. E qualquer aqui, vou ter esses dois. E terei cores como esta, que é C. E também adicionarei o deslocamento como fizemos antes para x e y. Desta forma, posso chamar o gráfico duas vezes por ano, uma para a sombra e outra E também adicionarei o deslocamento como fizemos antes para x e y. Desta forma, posso chamar o gráfico duas vezes por ano, para a forma principal. Então, para a sombra, vou chamar gráfico com, digamos, um deslocamento de 15 e uma cor de preto. E então vou chamar gráfico novamente. Mas desta vez com um deslocamento de 0 e carvão como a cor aleatória de cores que criamos aqui. Agora, se eu executar isso, teremos uma sombra que segue a espiral. Vamos, na verdade, fazer cinco. Então você pode vê-lo melhor. Agora você notará uma coisa que está muito errada com essa forma porque estamos desenhando a sombra para cada ponto. Algumas das vezes você vai descobrir que a sombra vai ultrapassar a forma principal porque eles estão se movendo separadamente. Então, como você pode ver aqui, ele realmente não se parece com algo abaixo da forma principal. E para fazer isso, vamos usar gráficos P. Portanto, é muito fácil corrigir isso porque os gráficos P nos permitem criar várias camadas que nunca se cruzariam. Então, eles literalmente vão em cima um do outro sem nunca se encontrar. Portanto, é como se mover no eixo z, semelhante ao Photoshop e ao Illustrator e todos esses aplicativos que usam camadas. Isso é muito simples de fazer. Só vou criar uma camada gráfica de pico aqui. E em vez de apenas usar o preenchimento assim, vou usar a camada para ambos. E então, para qualquer gráfico p, aqui terá que começar com o começo. E então e desenhe. E então estamos passando a primeira camada para esta, que será a camada de sombra porque precisamos que ela esteja na parte inferior. E na segunda camada será o gráfico principal. E depois vou adicioná-lo aqui. Então, vou precisar de duas camadas. Primeiro, chamarei a camada 1. O segundo parâmetro vai para a camada 2. Agora, na guia principal, isso vai reclamar. Então, também vamos precisar criar duas camadas de gráficos p aqui. O primeiro que vou chamar, e como temos matrizes, teremos que criar um array também. Então, o primeiro que seremos gráficos. Então, ele está segurando todos os gráficos principais. E isso vai ser um gráfico UP que terá a mesma contagem e a mesma coisa exata para as sombras. E então aqui, à medida que inicializamos essas espirais, também criaremos o gráfico ou cada camada gráfica para a matriz gráfica. Ele criará gráficos ou criará gráficos. Vamos manter todas as camadas do mesmo tamanho que a tela, então largura e altura, e então o mesmo vale para sombras. Isso vai exigir os dois argumentos, que serão o primeiro que dissemos ser as sombras. E então o segundo será o gráfico principal. Mas agora, se eu executar isso, não veremos nada porque os gráficos P só aparecem se você secá-lo usando imagem. Portanto, a primeira tem sombras garantidas na posição I. E esta imagem será desenhada em 000 porque tem a mesma largura e altura que a tela. E então a segunda imagem será cada um dos gráficos. E também vai ser em 000. Agora, se eu executar isso, veremos que todos eles têm traços novamente. Então, vou remover o NoStroke daqui e terei que colocá-lo dentro daqui porque ele precisa estar dentro da camada. Você também pode adicioná-lo depois de inicializar os gráficos aqui. Mas vai ser incomodado porque você vai ter que escrever, começar desenhos e desenhar novamente apenas para adicionar isso. Portanto, é muito mais fácil adicioná-lo a isso porque se torna mais uma linha. E agora, se eu executar isso, ele deve funcionar. Então, agora, à medida que a espiral passa, ela não se sobrepõe. Portanto, a sombra nunca se sobrepõe ao gráfico principal. Vamos adicionar mais espirais para que ela preencha a página. Então você pode ver como a sombra afeta todo o design. Depois de executar isso um pouco, você pode começar a ver um pouco mais de profundidade e o design em vez de apenas ter algo plano sem essa sombra, mesmo que seja muito simples e não muito realista, você ainda ver um pouco de dimensão para algo assim pode adicionar muitos interesses a alguns dos designs que você tem. Então, se você acha que seus designs são um pouco planos, basta adicionar uma sombra simples, compensando a mesma forma e veja se isso a conserta. É praticamente isso para a última técnica de texturização. Em seguida, discutiremos a última técnica de coloração, e isso é usar máscaras. 10. Cor 04: cores com máscaras: Para a técnica final de coloração, vamos discutir máscaras. Se você estiver familiarizado com a máscara do Photoshop, isso deve ser um pedaço de bolo. Caso contrário, basta acompanhar e será fácil de entender. Agora, a ideia de usar máscaras como forma de colorir seu design não é necessariamente muito convencional. Mas a maneira como eu vejo isso como você pode codificar o que quiser, qualquer gráfico que você quiser, digamos que apenas círculos aleatórios na tela. E então você pode usá-lo para mascarar uma camada de fundo que você criou de outros círculos aleatórios. Assim, parece que o design no topo, que é a máscara, está sendo colorido pela camada subjacente. razão por trás de colocar isso como uma técnica de coloração é porque sempre que eu usava máscaras no Photoshop, sempre senti como se fosse uma maneira de revelar algo para minha forma ou para minha máscara. Então, digamos que você tenha silhueta de uma dançarina e então você quer colocar um fundo de estrelas que é uma maneira de colorir essa silhueta. Não é apenas preto ou qualquer cor que a fotografia tenha. Então, o conceito é muito simples e a coda também é. Agora, para máscaras, você precisará de gráficos p ou imagens. Então, digamos que você tenha uma imagem ou imagem em preto e branco que deseja usar como máscara. Você pode importar isso ou carregá-la como uma imagem no processamento e usá-la como máscara. Mas, para este exemplo, vamos usar apenas gráficos P. Então, vamos criar a máscara usando arte generativa e também a camada de fundo, que será nossa cor aqui. Primeiro começaremos com apenas uma forma em cada uma das camadas, apenas para mostrar como a máscara funciona. O primeiro que vou chamar de máscara, e o segundo eu vou ligar para G e depois inicializaremos aqui. Então, para máscara, e vai criar gráficos como nós fizemos. A lição anterior terá a mesma largura da tela e a mesma altura. O mesmo vale para a camada gráfica. E agora podemos desenhar nossas formas dentro de cada uma delas. Então, para desenhar em qualquer camada gráfica de PPE, você precisará do método start draw e do método de desenho. E você sempre terá que fazer referência à camada gráfica. Então, a variável, o nome da camada gráfica. Então, aqui a camada de gráficos p que criamos é chamada de máscara. Então, vamos ter que fazer referência a isso repetidas vezes. Então, mesmo para o traçado, para o preenchimento, para as formas que você vai desenhar. Você sempre terá que fazer referência à máscara. Ou seja, se você quiser desenhá-lo dentro da máscara, se você quiser desenhá-lo dentro de G, vai ter que fazer referência a esse G. E agora vou desenhar apenas um círculo. E isso exigirá uma posição x, posição y e, em seguida, uma largura. E para secar, vamos usar a imagem e fazer referência a essa camada e depois posicioná-la. E porque é a mesma largura da nossa tela, então vamos colocá-la em 000 para que ela se encaixe na tela. Agora, se eu executar isso, devemos ver esse círculo. Em seguida, vamos criar este. Então, também vai começar com o início do sorteio e depois desenhar. E então eu também vou desenhar um círculo. Vou torná-lo um pouco maior, só assim e nós mascaramos, você verá que fica menor porque essa máscara vai cortá-la. E então vamos desenhar da mesma forma que desenhamos a máscara. E agora esta é a camada gráfica, a camada gráfica G e está em cima da máscara. Vamos mudar as cores dos dois usando uma das cores da minha matriz de cores. Eu usei o mesmo que usei antes nas outras lições. E para adicionar uma cor à nossa camada gráfica, basta preencher. Então, da mesma forma que fazemos aqui, dentro de todo o esboço, a única diferença é que estamos prendendo-o dentro dessa camada. Em vez de apenas colocá-lo na camada gráfica principal, vou escolher qualquer uma das cores. Isso realmente não importa agora. E também farei NoStroke para ambos. Porque para a camada de máscara, se você usar máscaras antes, para branco ou qualquer coisa branca mostrará o que está por baixo dela, e então o preto esconderá todo o resto. Então, se você tem um círculo branco com um traço de preto, então. O que quer que chegue perto desse derrame será escondido. Então, vou fazer um não derrame porque não quero que ele interfira com um mascaramento. Agora que sabemos como eles se parecem ou como a máscara se parece, podemos simplesmente removê-la aqui e podemos ir antes de desenhar a imagem, eu posso apenas fazer máscara de ponto g. Usando a máscara. Então, o que eu quiser mascarar, usarei o método de máscara nisso e, em seguida, usarei a camada de máscara. E se eu executá-lo, deve ser menor agora porque a máscara cortou essa forma. Mas se você olhar de perto, verá que é um pouco grosso. E a razão para isso porque não temos um plano de fundo para a camada ou para nenhuma das camadas. Então, para a camada de máscara, vamos adicionar um fundo de preto porque queremos esconder qualquer coisa lá, porque se colocarmos em branco, então tudo será mostrado. Então, vou fazer 0 para preto agora, imagens muito mais nítidas porque redefinimos o plano de fundo e podemos fazer a mesma coisa por este. No entanto, isso não vai aparecer aqui porque a máscara é menor do que essa camada que está tentando mascarar. No entanto, se o círculo for menor que, poderemos ver a cor por trás dele. Então, se eu colocar um plano de fundo vermelho, ou digamos isso como uma cor da matriz. Então, digamos que a segunda cor na matriz. E então vou fazer isso muito menor. Então vou fazer isso maior, e então farei isso um 100. Então acabei de trocar os tamanhos. E agora, se eu executá-lo, eu realmente vejo a camada de fundo dessa camada gráfica. Então, colorimos nosso círculo dentro da máscara usando o que estiver em segundo plano. Para este exemplo, parece contra-intuitivo criar tudo isso apenas para criar dois círculos de cores diferentes que poderíamos ter criado usando apenas duas linhas de código. No entanto, isso será benéfico se você tiver algo se movendo em segundo plano e você só quer um mascote com um monte de círculos aleatórios no topo. Então, se eu voltar para cada uma dessas camadas e, em vez de apenas criar um círculo para cada uma, criarei vários círculos lá. Para este, criaremos uma matriz. E vamos dar apenas uma contagem aleatória que eu inicializarei aqui. Vou mantê-los todos do mesmo tamanho por enquanto. Mas você também pode aleatorizar os tamanhos. Então, se eu apenas remover a máscara por um pouco e aleatorizar as posições de 0 para largura e depois de 0 para altura. Ou você também pode, se você definir isso como um raio aqui, então ele pode fazer de relação ao diâmetro, porque é isso que é isso, o que realmente é. E então do diâmetro dividido por dois para quê? Diâmetro negativo dividido por dois. E o mesmo acontece aqui. E agora temos um monte de círculos. Então, vamos realmente dar-lhes cores diferentes. E vamos fazer a cor de fundo. Aquele que defini aqui, então o azul não se esconde. Vamos aumentar isso para talvez 50. Então, temos muito mais. Agora, se eu revelar a camada de máscara, poderemos ver uma maneira diferente de colorir esse círculo. Vamos também criar o mesmo para a máscara. E vamos torná-lo menor. Em vez de ter apenas um círculo, faremos os aleatórios e não precisamos do preenchimento aleatório porque precisamos que todos sejam brancos para mostrar o que está por baixo dele. E vamos redefinir isso aqui para que não tenhamos duplicatas. E esqueci de mudar isso para mascarar. Agora ele deve funcionar. E a razão pela qual isso está acontecendo onde você não está vendo onde as coisas começam e terminam é porque meu plano de fundo para a tela real é da mesma cor que o plano de fundo dessa camada gráfica. Então, se eu mudar isso para, digamos 30, quem vai ser uma cor cinza escuro. E você poderá ver a máscara e a camada subjacente. E também vamos criar uma contagem diferente para máscaras. Então é por isso que adicionei isso como uma técnica de coloração porque você pode ver que qualquer forma que você criar na camada de máscara, seja qual for o design , seja em movimento ou estático, então você poderá colorir de maneiras únicas porque você estão usando outra camada que pode realmente se mover também se você quiser que ela seja animada. Mas, para este exemplo, estamos fazendo apenas imagens estáticas. Há outro exemplo ou outra maneira que eu quero mostrar como podemos mascarar isso. Então, em vez de apenas círculos aleatórios, vamos criar uma coluna de linhas. Não vai ser diferente. É apenas um exemplo diferente que eu quero mostrar. Em vez disso, entraremos em linha de fazer. E não vai ter um método sem traçado neste, mas vai ter um não preenchimento. Mas mesmo que eu não coloque este porque as linhas só tomam traço, isso não afetará nada. Mas eu só gosto de tê-lo no caso de eu mudar alguma coisa ou reouvir ou adicionar qualquer coisa que exija um preenchimento e eu não quero que ele tenha um preenchimento. Então, criarei uma linha ou, na verdade, vamos manter o círculo C. E então vou apenas comentar e criarei uma linha aqui. Então, eu quero que cada uma das linhas vá de 0 para a largura e depois se estenda pela altura da tela. Então, vou precisar apenas de uma altura de célula ou preciso definir uma altura de célula com base no contador que tenho. Então, vou apenas flutuar. A altura da célula será igual à altura da tela dividida pelo flutuador da contagem m. Ou seja, se eu não o fizesse flutuar, sim, eu os fiz inteiros. E então, para as exposições, vai ser estático. A única coisa que vai mudar é a posição y. Então, para x, vamos de 0 para a largura. E então eu adicionarei o y. Para cada um dos lados é livre cada ponto da linha. Então, faremos que eu multipliquei pela altura da célula. E o mesmo acontece aqui. E porque o traçado é, por padrão, preto, isso não mostrará nada. Vou ter que trocar máscara para máscara, traçar para branco. E também definirá o peso do traçado com base na altura da célula. Então vou fazer a altura da célula dividida por duas porque não quero que ela cubra toda a tela. Se eu colocá-lo como curva de altura da célula e vamos cobrir toda a tela, mostre toda a camada de fundo. E então também podemos mostrá-lo aqui apenas para verificar a aparência antes de usar a máscara. Então, vamos reduzir o número de contagens. Se eu fizer 10 e adicionar uma margem também. Então vou colocá-lo aqui. E a razão pela qual estou colocando isso em cima das minhas formas que estou criando é só porque quero que elas sejam fechadas. Então eu sei que eles pertencem a este e sei que não vou mudá-los em nenhum outro lugar. Vai ser apenas para este, mas sinta-se à vontade para colocá-los aqui como variáveis globais. Então, para a margem, vamos fazer 50 e então eu vou fazer isso passar da margem e depois largura menos margem. E então eu quero que isso seja empurrado pela altura da célula dividida por duas. E o mesmo vale para isso. Então você também pode criar uma variável para isso porque estamos duplicando agora. E para manter nosso código limpo, devemos apenas torná-lo uma variável. Então vou chamá-lo de posição leve posição k. Os comerciantes são grandes demais, então vamos fazê-los 20. E agora não precisamos mostrar a máscara e vamos usar o método da máscara. E, por exemplo, usar máscaras é muito divertido na arte generativa porque você é capaz de gerar a máscara e a camada de fundo ao mesmo tempo e usar uma para esconder a outra. Também tenho um tutorial do YouTube sobre algo animado, estar em segundo plano por trás dessas máscaras. Então, se você estiver interessado em ver como isso é criado, basta verificar esse vídeo. Mas para esses exemplos, estou tentando torná-los estáticos apenas para focar nas técnicas mais do que focar na animação ou complicar os exemplos. Isso é tudo o que temos que aprender hoje sobre essa técnica de coloração e texturização. Para a próxima lição, vamos criar um projeto utilizando algumas das técnicas que usamos nas lições. 11. Projeto final: Agora que terminamos com todas as técnicas, vamos mergulhar em um projeto. Então, para o seu projeto, você combinará duas a três técnicas das lições antes disso, seja usando um dos muitos exemplos de uma das lições e adicionando outra técnica a ela ou apresentando seu próprio exemplo. Então, para o meu projeto, vou combinar sombras e a primeira técnica de texturização, que está criando minhas próprias formas. E vou criar papéis aleatórios espalhados na tela. Então eu vou, os papéis não serão retângulos regulares. Alguns deles serão papéis rasgados, sabendo que o papel é uma forma retangular, na maioria das vezes, vou criar uma função que tem quatro parâmetros para começar, e vou chamá-lo de papel. Portanto, os quatro parâmetros serão os mesmos que qualquer retângulo. Para flutuar x, flutuar y, flutua a largura e flutuar para a esquerda, porque quero que parte do papel seja rasgada da borda inferior. Vou criar o papel usando vértices. E isso sempre começa com a forma Begin e termina com uma forma. Então, vou começar com isso. E depois mais vértices. O primeiro será do canto superior esquerdo, e essa será a nossa posição principal X e Y. Então isso é x e y. E então vamos passar para a direita e depois para a esquerda, e depois fecharemos a forma. Então, para ir para a direita, isso significa que vamos nos mover pela largura da exposição. Então, vamos adicionar W ou a largura aqui. Faça a exposição e, em seguida, y permanecerá o mesmo. E então, para o terceiro, vamos ficar onde estamos agora, no eixo x e, em seguida, no eixo y vamos adicionar a altura porque estamos indo para baixo. E finalmente, vou voltar para a esquerda, mas somos tão Dan, então no eixo x vamos voltar para x, mas no eixo y vamos ficar com o mesmo que tínhamos antes. E agora vamos colorir aqui. Então, vamos colocá-lo em 00, e então vamos fazer um 100 por um 100 e 150. Então é assim que um papel normal retangular parece. Mas queremos adicionar uma lágrima aqui ao papel para isso. Lembrando da primeira lição, sei que estou precisando de uma resolução para agora quantos pontos vou precisar para as tarifas. E também preciso inicializar as posições de cada um dos pontos para poder conectá-los ao primeiro e ao último porque vou usar vértices curvos em vez de vértices. E sabendo desde a primeira lição que precisaremos alguns pontos de controle antes são alguns dos vértices principais para ver esse ponto. Então, vou criar uma matriz vetorial p. Vou chamá-lo de posições ou PDV. E então será de resolução de comprimento. E isso tem que ser um número inteiro porque isso não permitirá nada além de um inteiro. E então vou precisar do espaçamento entre cada um desses pontos. Tipo como criar uma grade. Então termine o círculo. Na primeira lição, tivemos que fazer o ângulo, mas para isso vamos apenas fazer os espaços entre cada ponto. E podemos simplesmente fazer isso criando uma variável. E será a largura do papel dividida pelo flutuador da resolução. E estamos convertendo esses para flutuar porque queremos uma divisão mais precisa. E então vamos usar um loop for para criar essas posições. Então, a exposição para cada uma delas será, eu multiplico-a pelo espaçamento. Então, exatamente como criar uma grade. E a posição y para este será a altura. Este aqui. Agora vou criar essas posições criando uma nova instância da classe de vetor p e adicionando cada uma em sua respectiva posição x e posição y. Agora que isso é inicializado, podemos usá-lo aqui. Então, isso vai no mesmo espaço que este. Mas como eu também quero que isso exista, vou criar uma condicional se aqui. E vou verificar se a resolução é maior que 0, então quero fazer os vértices da curva. Caso contrário, eu queria fazer isso. Então, se a resolução for igual a 0, então eu quero que isso aconteça de outra forma. E apenas elimina quaisquer valores negativos que vou fazer mais, se Raz for maior que 0, você também pode fazer o oposto, mas isso é apenas para eliminar quaisquer valores negativos. Agora vamos criar um loop for. Mas como estamos indo da direita para a esquerda aqui, vamos da última posição na matriz para a primeira posição. E isso será se eu for igual à resolução menos 1. Então, a posição final na matriz para I, ou a condição será se eu for maior igual a 0, então vamos descer para 0, e então vamos diminuir em vez de incrementar. Isso está indo do lado oposto do nosso loop for normal. E agora vamos chamar o método de texto vermelho curva. E esta será a posição que eu ponto x e depois a posição eu tenho y. Então, obtendo o vetor p e depois obtendo a exposição e, em seguida, obtendo a posição y para o y. E agora vamos adicionar o quinto parâmetro ou argumento em nosso artigo método. E vamos tentar 0 apenas para garantir que tudo esteja funcionando bem. E então vamos tentar cinco também antes de continuarmos em forma porque não fechamos a forma, podemos simplesmente chamar roupas. E vai do último ponto para o primeiro. E agora você verá que está fechando. Mas temos um problema aqui porque não temos um vértice de curva no final aqui que se conecta com este. Então vou chamar vértice curvo aqui no final. E essa será a posição 0, x e y. E agora temos um retângulo. A razão pela qual não precisamos de um antes deste aqui, como fizemos com o círculo, é porque já temos vértices antes dele. Então B contam como, ou este conta especificamente como o outro ponto de controle para o vértice atual ou o ponto de controle anterior para o primeiro vértice de curva aqui. Agora, para ver que realmente temos vários pontos aqui, você pode mudar a cor dos vértices aqui, ou o que vamos fazer é adicionar um deslocamento Y e nós o fazemos aqui. Então, o deslocamento Y será um valor aleatório de menos dois para dois. E então vamos adicioná-lo a este. Agora, se eu aumentar isso para 15, verei mais. Quero fazer algo um pouco mais chique. E isso é adicionar uma onda senoidal aos deslocamentos Y. Além da randomização. Para isso, vou adicionar duas variáveis que você costuma usar com qualquer onda senoidal, e isso será frequência. E darei a ele um valor de 100 e depois amplitude. E darei a isso um valor de cinco. E depois adicionando a isso, estamos fazendo uma onda senoidal. Porque eu quero que a onda atravesse a parte inferior da página. Vou multiplicar i pela frequência do ângulo. E então vou multiplicar isso pela amplitude. E você não precisa colocar isso entre parênteses porque multiplicação acontecerá antes de qualquer adição. Portanto, há uma hierarquia aqui que não precisamos de parênteses quatro. E agora, se eu executar isso, devemos ter uma onda senoidal. Então, se eu reduzir isso para cinco, teremos uma onda senoidal. Se eu aumentar isso para 115, isso para 200, e então eu aumentarei isso para 15. Agora, podemos ver a onda senoidal um pouco melhor. Agora, se você quiser que a amplitude seja maior, você pode simplesmente aumentar isso. E a amplitude é basicamente a altura de cada uma das ondas. E então a frequência é a frequência com que a onda é frequente. Então, se tivermos em 200, então teremos mais ondas. E se tivermos em 50, obteremos menos ondas. Vou mantê-lo em centenas e isso às cinco. E nosso se assemelha a papel desenhado. Agora vamos adicionar mais papel e aleatorizá-lo na tela. Então, eu simplesmente não consegui dentro de um loop. E inicializarei a contagem para as posições. Vou torná-los aleatórios de 0 para a largura e depois aleatórios de 0 para a altura. Se eu executar isso, vai ser uma bagunça porque também esquecemos de adicionar x e y a essas posições. Então você pode adicionar aqui mais x ou você pode adicionar aqui. E isso vai adicionar y. E agora, se eu executar isso, ele deve funcionar perfeitamente bem. Agora, para a sombra, vou adicionar essa coisa toda de novo. Mas com um deslocamento, você pode criar uma função para criar a forma do papel e, em seguida, a sombra para ela. Mas vou fazer isso dentro dos meus métodos de papel. E, como sabemos, a sombra tem que ir primeiro porque o que for primeiro, estará abaixo do código que vem depois. Então essa será a sombra e eu vou compensá-la usando push and pop. E, em seguida, usando os métodos de tradução, alguns isolando o movimento para isso ou a tradução para este. E então eu vou traduzir e faremos um deslocamento x e yoffset. Então, vamos fazer 33. E também, a razão pela qual você usa para persa não push matrix é porque isso me permite empurrar os estilos e a tradução ou a transformação. E depois vou adicionar o preenchimento. Então, para a sombra, o preenchimento será dessa cor. E então meu jornal está ficando branco. Agora, se eu executar isso, devemos ver uma sombra se formando. E então aqui em cima eu não farei NãoStroke para todos eles. Além disso, a sombra torna o papel visível contra o fundo, ou meio que aumenta o contraste entre os dois. Se o seu fundo é de cor clara como o meu, mas se você quiser usar um traço , sinta-se à vontade para fazê-lo. Claro. Também adicionei cor aqui. Se você quiser, se você quiser adicionar cores diferentes para o papel, não vou usá-lo. Eu só queria te mostrar que você pode fazer isso se quiser. E então eu adicionei uma matriz para cores de texto se você quiser aleatorizar isso também. Então, adicionarei outra cor a isso mais tarde. Assim, podemos ver que você pode aleatorizar a cor do texto. Também podemos aleatorizar a altura do papel. Vou chamá-lo de altura do papel, e vamos adicioná-lo aqui. Então, a altura do papel será um valor aleatório e eu vou fazer isso de 180 a 30. E a largura que vou manter fixa em 150. Agora vamos executar isso. E porque estamos desenhando os papéis do canto superior esquerdo, não vamos vê-los passando pelo saldo do topo, onde a esquerda, mas vamos vê-los ir para a direita ou para baixo. Então, para eliminar isso, vou remover a largura do papel daqui e a altura do papel daqui. Então eu vou mudar isso para a largura do papel. É uma boa prática se você começar a ver as coisas repetindo para criar apenas uma variável para elas ou para uma função. E para isso, a largura do papel será igual a 150. E agora eles não deveriam sair dos limites. Agora vamos criar o texto dentro dos papéis. Para isso, vou criar um método chamado texto. E vai ter várias linhas. E eu esboçei todos esses de antemão, então eu sei quais parâmetros eu preciso. Então alanina várias linhas porque eu aleatorizei isso. E então também precisarei uma exposição porque quero saber onde ela começa dentro do meu jornal. E então vou precisar de uma posição y. E, claro, vai precisar de uma largura e uma altura para cada uma das linhas. E, finalmente, vou precisar de margens laterais e margens superiores. E a razão pela qual estou separando esses, porque às vezes você vê que as margens superiores são um pouco maiores e alguns cadernos. Então, vou ter uma margem lateral e, em seguida, uma margem superior. E eu os preencho com as cores aqui. Então, criei outra matriz que chamo de cores de texto. Só tinha uma cor antes, mas agora eu copiei tudo o que estava aqui. Não precisamos mais disso, mas se você quiser ter cores diferentes para o papel também, você pode anunciar cores mais profundas. Mas vou aleatorizar e apenas as cores do texto. E eu removerei a cor de fundo porque isso é o mesmo. Portanto, não temos algo ou um papel como ele foi cortado. Então, vou ter essas cores. E a maioria dessas cores é a mesma que usamos antes. Você pode pausar e copiar essas cores também. Agora voltando aqui, vou aleatorizar as cores do texto. Então, cada papel tem um texto colorido diferente. E para isso vou usar exatamente o que usei antes com a randomização. Então, só vai para a randomização ser Index. E tem que ser um número inteiro porque aleatório produz um flutuador e isso será de 0 à última posição na matriz, porque vamos ter um monte de linhas. Vai ser semelhante à criação de linhas dentro de uma grade. Então, criaremos um loop que vai de 0 para o número de linhas. Porque só surgiu. Vamos apenas criar uma variável que vou chamar de altura do texto. E isso será que eu multiplicá-lo pela altura que eu daria. Então, a altura de cada linha. E eles vão apenas desenhar um retângulo. Então, o retângulo vai passar da margem lateral x mais. Então, é como empurrar pela margem lateral que eu inicializo ou que vou inicializar aqui com um argumento. E então, para y, será y mais a altura dos textos mais a margem superior. Então, vamos empurrar cada um deles pela altura do texto. E vai ser diferente a cada vez porque é multiplicado pelo I. E então a margem superior será a mesma, então vai empurrar tudo para baixo. E então a largura menos margem lateral multiplicada por dois, porque estamos empurrando-a por uma margem lateral, teremos que subtrair duas margens laterais deste lado porque ela será empurrada por uma. E, finalmente, ele terá uma altura que será especificada aqui. E vamos empurrar a largura e a altura para baixo para que o código fique muito mais limpo e fácil de ler. Agora vou chamá-lo dentro dos métodos de papel. E eu darei cinco linhas. Então, não vou aleatorizá-lo no início. Então você pode ver se há algum problema. E então ele vai levar a mesma exposição que o papel, a mesma posição y que o papel, mesma largura que o papel. E então ele terá uma altura específica. Então, vou fazer cinco. E para a margem lateral, vou fazer 10. E então, para a margem superior, vou fazer 30. Agora, se eu executar isso, veremos um pequeno problema em nosso código. E isso é que não há espaçamento entre linhas. Portanto, não há espaçamento entre as linhas. Isso geralmente é que eles estão em texto real. Então, teremos que multiplicar a altura do texto aqui por dois. Isso garantirá que tenhamos uma altura do texto e, em seguida, um espaço entre cada uma das linhas equivalente à altura do texto. Você também pode criar um espaçamento entre linhas diferente da altura do texto que você pode especificar. Você pode adicioná-lo aos parâmetros aqui. Se você não quiser que ele tenha o mesmo espaçamento entre linhas que a altura do texto. Mas vou mantê-lo o mesmo. E agora, se eu executá-lo, veremos um texto melhor. Mas acho que ficará melhor se eu aleatorizar isso. Então, como temos um número inteiro, teremos que lançá-lo em um número inteiro e vamos torná-lo um número aleatório de dois a sete, digamos. E agora é um pouco mais realista. Quero dizer, ainda é muito gráfico e não realista. Mas acho que se você aleatorizar algo assim, ficará mais agradável. E também reduzirei o número de papel aqui. E depois adicionarei alguma rotação ao papel. Normalmente, se você vir uma pilha de papel no chão ou em uma mesa, não terá a mesma rotação. Então, vou fazer isso usando push and pop para uma transformação. Então eu vou fazer push e você pode fazer push matrix porque não vamos fazer estilos aqui. E também vou limpar isso e depois adicionarei o método pop. E então aqui, vou traduzir primeiro. E vou traduzir para essas posições. Então, isso vai ser 0, 0. Agora podemos trazer isso de volta. E a razão pela qual estou traduzindo é porque rotação vai girar a partir do canto da página. E se eu não traduzir para cada papel, ele girará a partir do ponto zero da tela. Então, o que estou fazendo aqui, estou empurrando a tela para o canto do papel em vez disso. Então, quando eu girar, vou girar o papel a partir desse ponto. Agora, se eu girar e eu farei uma rotação aleatória a partir de um quarto pi negativo. Verdadeiro trimestre pi. Porque, como eu não preciso de tanta rotação, você também pode fazer uma rotação completa, se quiser. Então, vamos executá-lo e ver o que acontece. Agora parece mais natural. Então, mesmo que eu tenha 10, não parecerá muito lotado. Por fim, vou aleatorizar o tipo de artigos que preciso. Não quero que todos tenham terrorismo. Quero que alguns deles fiquem intocados. Então, vou criar um número aleatório só tem dois estados. Então, um será se r for maior que 0,5. Portanto, será uma chance de 50% para cada tipo de papel aparecer. E este vai ser o mesmo, mas com uma resolução de 0. E agora eu tenho um papel cheio e um papel rasgado, e isso é praticamente isso. Eu usei fazer as técnicas que aprendemos nas lições. Uma é adicionar textura às suas formas e a outra está adicionando sombras para maior profundidade. Agora é sua vez de criar seu próprio projeto. Escolha de duas a três técnicas para criar um dos exemplos que criamos em qualquer uma das lições ou para fazer seus próprios projetos como eu fiz aqui. Você não precisa usar uma técnica de coloração e uma técnica de textura. Mas se é isso que você quer fazer, então, por favor, faça isso. Mas sinta-se à vontade para escolher qualquer um deles para que você possa fazer técnica extrema doce ou até mesmo três técnicas de coloração no final. Então, neste exemplo, se eu quisesse adicionar outra técnica de coloração, adicionaria as máscaras e pegaria uma imagem de papel ou uma textura de papel e adicionaria a cada um dos papéis. Dessa forma, você pode ter uma cor diferente para os papéis do branco com um pouco de textura. Então, na técnica de coloração de máscaras, usamos gráficos de pico, um para a máscara e outro para as formas. Mas para este exemplo, se eu quisesse adicionar uma textura de papel, então a máscara será o gráfico P na forma ou o que quer que seja em massa será papel ou a textura que você vai carregar como uma imagem em seus projetos. Se você quiser seguir este projeto para seu projeto final, terá medo de fazê-lo, mas eu recomendaria adicionar outra dimensão a ele. Outra coisa que eu poderia ter adicionado a este projeto são elementos de fundo, como uma grade, por exemplo, para criar um piso de azulejos. Você também pode adicionar uma imagem de fundo de piso de madeira ou qualquer tabela de textura. E você definitivamente pode colorir isso com qualquer técnica de codificação. Talvez não seja a coloração pelo fundo, mas se você quiser ter termos diferentes para o papel, talvez você possa usar os métodos de interpolação de cores com alguma randomização como fizemos na primeira técnica de coloração. Ou você pode fazer colorir por distância para talvez dar diferenças tonais na cor do papel, mas não necessariamente com interpolação de cores aleatória, meio que imitando a luz solar indo para a sala e colorindo alguns dos papéis de diferentes cor. E, claro, tudo isso não é muito realista, mas ainda assim, é algo para adicionar ao seu trabalho artístico. Finalmente, se você tiver alguma dúvida sobre esta lição ou qualquer uma das outras lições, por favor me avise na discussão abaixo. Caso contrário, mal posso esperar para ver seus projetos. Muito obrigado por fazer este curso, e te vejo em outro.