CSS ::: Dicas & Truques ::: Cores de Fundo e Imagens de Fundo

Como definir uma imagem de fundo para a página HTML em CSS usando a propriedade background-image

Quantidade de visualizações: 8507 vezes
Nesta dica mostrarei como usar a propriedade background-image do CSS (Cascading Style Sheet) para aplicar uma imagem de fundo às nossas páginas HTML. Note que, neste exemplo, não controlamos como e se a imagem de fundo será repetida. Em outras dicas dessa seção você aprenderá como isso pode ser feito.

Veja o resultado desta dica na figura abaixo:



E agora veja o código HTML completo para o exemplo, incluindo a marcação CSS:

<html>
<head>
<title>Estudando CSS</title>

<meta name="viewport" content="width=device-width, 
  initial-scale=1">

<style type="text/css">
  body {background-image: url('fundo2.jpg')}
</style>

</head>
<body>
 
</body>
</html>



React Native ::: React Native - Componentes Visuais ::: Image

Como exibir imagens e fotos em aplicações React Native usando o componente Image

Quantidade de visualizações: 1097 vezes
O componente Image do React Native é usado quando queremos carregar imagens e exibí-las em nossas aplicações mobile. Este componente possibilita a exibição de diferentes tipos de imagens, incluindo imagens remotas (em um site, por exemplo), recursos estáticos, imagens em locais temporários e imagens a partir do armazenamento local, tais como imagens da câmera.

Veja uma aplicação React Native completa que mostra como carregar uma imagem da internet e exibí-la em um componente Image. Note que a imagem a ser exibida é a logo do nosso site. Eis o código:

import React, {Component} from 'react';  
import {Image, View} from 'react-native';  
   
type Props = {};  
export default class App extends Component<Props> {  
  render() {  
    return (        
      <View style={{padding: 10, flexDirection: 'column'}}>  
        <Image style={{width: 237, height: 49}} source={{uri:
           'https://www.arquivodecodigos.com.br/logo2.jpg'}} /> 
      </View>  
    );  
  }
}

É importante observar que, quando a imagem estiver sendo carregada de uma rede (internet, por exemplo) ou via propriedade data, temos que, manualmente, indicar as dimensões da imagem a ser exibida.


Java ::: Dicas & Truques ::: Matemática e Estatística

Como arredondar um número para cima em Java usando a função ceil() da classe Math

Quantidade de visualizações: 10002 vezes
Em várias situações nós precisamos arredondar um valor real para cima, ou seja, para o valor inteiro maior ou igual ao argumento fornecido. Para isso nós podemos usar a função ceil() da classe Math da linguagem Java.

Esta função recebe um valor double e retorna um outro valor inteiro (como double) maior ou igual ao argumento fornecido.

Veja um exemplo Java completo no qual pedimos para o usuário informar um valor com casas decimais e devolvemos o valor arredondado para cima:

package estudos;

import java.util.*;

public class Estudos {
  public static void main(String[] args) {
    // para ler a entrada do usuário
    Scanner entrada = new Scanner(System.in);
    
    // vamos pedir para o usuário informar um número
    // real com casas decimais
    System.out.print("Informe um número com casas decimais: ");
    // vamos ler o número informado
    double a = Double.parseDouble(entrada.nextLine());
    
    // agora vamos arredondar o valor para cima
    double b = Math.ceil(a);
    
    // e mostramos o resultado
    System.out.println("O número arredondado para cima é: " + b);
  }
}

Ao executar este código Java nós teremos o seguinte resultado:

Informe um número com casas decimais: 6.31
O número arredondado para cima é: 7.0


Python ::: wxPython ::: Controles Visuais Básicos do wxPython

Como usar a função GetDefaultSize() para obter o tamanho padrão dos botões wx.Button em uma determinada plataforma e um determinado tamanho de fonte

Quantidade de visualizações: 6531 vezes
Quando estamos escrevendo interfaces wxPython para múltiplas plataformas, é interessante usar o método GetDefaultSize() para obter as dimensões padrão dos botões. Isso permite que o próprio sistema determine o tamanho dos botões baseado no tamanho da fonte usada.

Este método retorna um objeto da classe wx.Size e as dimensões podem ser obtidas com o auxílio das propriedades width (largura) e height (altura).

Veja um exemplo wxPython completo:

# vamos importar a biblioteca wxPython
import wx

class Janela(wx.Frame):
  def __init__(self):
    wx.Frame.__init__(self, None, -1, 
      "Usando wx.Button", size=(350, 200))
    
    # Cria um painel
    panel = wx.Panel(self)

    # Cria um botão e o adiciona no painel
    self.btn = wx.Button(panel, label="Clique Aqui", 
      pos=(10, 10), size=(100, 25))

    # Anexa um evento ao botão
    self.Bind(wx.EVT_BUTTON, self.OnBtnClick, self.btn)

  # Método que será chamado ao clicar o botão
  def OnBtnClick(self, event):
    # obtém o tamanho padrão dos botões
    # nesta plataforma
    dimensoes = self.btn.GetDefaultSize()

    dlg = wx.MessageDialog(None, u"A largura padrão é: " 
      + str(dimensoes.width) + u" pixels e a altura " +
      u"padrão é: " + str(dimensoes.height) + " pixels",
      "Usando wx.Button", wx.OK | wx.ICON_INFORMATION)
    result = dlg.ShowModal()
    dlg.Destroy()

if __name__ == "__main__":
  app = wx.App()
  janela = Janela()
  janela.Show(True)
  app.MainLoop()



Java ::: Desafios e Lista de Exercícios Resolvidos ::: Arquivos e Diretórios

Exercícios Resolvidos de Java - Um programa que recebe um caminho e nome de um arquivo e retorna apenas o caminho, sem o nome e extensão do arquivo

Quantidade de visualizações: 7611 vezes
Pergunta/Tarefa:

Escreva um método Java que recebe um caminho e nome de arquivo na forma:

"C:\temporario\Java\dica.txt"

e retorne apenas o caminho do arquivo, sem o nome e extensão do arquivo. Assim, para o caminho acima, o retorno deve ser apenas:

"C:\temporario\Java"

Eis a assinatura do método a ser criado:

public static String getCaminho(String caminho);
Dica: Escreva este método de forma que o mesmo funcione tanto no Windows como no Linux, ou seja, use File.separatorChar para obter o separador de diretórios na máquina na qual o código está sendo executado.

Resposta/Solução:

Veja a resolução comentada deste exercício usando Java console:

package estudos;

import java.io.File;

public class Main {
  public static void main(String[] args) {
    // define um caminho e nome de arquivo
    String caminho = "C:\\temporario\\Java\\dica.txt";

    // vamos retornar apenas o caminho do arquivo, ou seja, retirar o
    // nome do arquivo
    String caminhoFinal = getCaminho(caminho);

    // vamos mostrar o resultado
    System.out.println("O caminho do arquivo é: " + caminhoFinal);
  }

  public static String getCaminho(String caminho){
    // vamos obter o índice da última ocorrência do separador de caminho
    int pos = caminho.lastIndexOf(File.separatorChar);
    if (pos > -1) {
       return caminho.substring(0, pos);
    }

    // por padrão vamos retornar uma string vazia
    return "";
  }
}

Uma variação deste exercício é a criação de um método que recebe o caminho e nome do arquivo e retorne apenas o nome do arquivo, seguido por sua extensão.


JavaScript ::: Dicas & Truques ::: Mouse e Teclado

Como bloquear o botão direito do mouse em suas páginas HTML usando JavaScript

Quantidade de visualizações: 81 vezes
Em algumas situações, principalmente games desenvolvidos em JavaScript ou HTML5, nós gostaríamos de evitar o botão direito do mouse, ou seja, o menu de contexto no corpo da página web.

Para isso só precisamos retornar false para o evento oncontextmenu. Veja como isso pode ser feito no trecho de código JavaScript abaixo:

<html>
<head>
  <title>Estudos JavaScript</title>
</head>
 
<body oncontextmenu="return false">

<h1>Você não pode usar o botão direito nessa página</h1>

</body>
</html>

Uma boa idéia é avisar ao usuário (por meio de uma mensagem window.alert) que ele não pode usar o botão de contexto no documento HTML. Veja:

<html>
<head>
  <title>Estudos JavaScript</title>
</head>
 
<body oncontextmenu="return aviso()">

<script type="text/javascript">
  function aviso(){
    window.alert("Botão direito não permitido.");
    return false;
  }
</script>

</body>
</html>

Agora, ao clicarmos com o botão direito do mouse na página, uma mensagem window.alert será exibida com o seguinte texto:

Botão direito não permitido.


C++ ::: Dicas & Truques ::: Ponteiros, Referências e Memória

Como alocar memória dinâmica usando o operador new do C++

Quantidade de visualizações: 12347 vezes
Em algumas situações precisamos alocar memória dinamicamente. Em C++ isso é feito com o auxílio do operador new. Este operador permite alocar uma determinada quantidade de bytes, alinhados de forma a representar o objeto para o qual queremos reservar memória.

Veja um exemplo de código no qual alocamos memória dinâmica para uma variável do tipo int:

#include <iostream>

using namespace std;

int main(int argc, char *argv[]){
  // aloca memória para um objeto do tipo int
  int *ponteiro = new int;

  // vamos definir o valor para o objeto recém-alocado
  *ponteiro = 20;

  // vamos exibir seu valor
  cout << *ponteiro << endl;

  // vamos liberar a memória
  delete ponteiro;

  system("PAUSE"); // pausa o programa
  return EXIT_SUCCESS;
}

Note que aqui a memória foi alocada e guardada em um ponteiro. Veja também o uso do operador delete para liberar a memória alocada. Isso evita os vazamentos de memória tão frequentes em aplicações que lidam com a memória dinâmica.

É claro que este não é o exemplo mais prático. Qual a vantagem de se alocar memória para um int? Declarar uma variável teria sido mais eficiente.

A alocação de memória dinâmica é mais útil quando estamos lidando com objetos mais complexos que os tipos básicos. Alguns exemplos envolvem a criação de objetos de classes, matrizes, estruturas de dados, etc.

Veja um exemplo no qual temos uma declaração de uma classe chamada Cliente e em seguida alocamos memória para uma instância desta classe:

#include <iostream>
#include <string>

using namespace std;

// declaração da classe Cliente
class Cliente{
  public:
    Cliente();
    string obterNome();
    void definirNome(string);
  private:
    string nome;
};

// implementação dos métodos da classe
Cliente::Cliente(){} // construtor vazio

// obtém o nome do cliente
string Cliente::obterNome(){
  return this->nome;
}

// define o nome do cliente
void Cliente::definirNome(string nome){
  this->nome = nome;
}

int main(int argc, char *argv[]){
  // aloca memória para um objeto da classe Cliente
  Cliente *c = new Cliente();

  // vamos definir o nome do cliente
  c->definirNome("Osmar J. Silva");

  // vamos exibir o nome do cliente
  cout << c->obterNome() << endl;

  // vamos liberar a memória usada
  delete c;

  system("PAUSE"); // pausa o programa
  return EXIT_SUCCESS;
}

Ao executar este código C++ nós teremos o seguinte resultado:

Nome do cliente: Osmar J. Silva


R ::: Dicas de Estudo e Anotações ::: Variáveis e Constantes

Como usar a função class() da linguagem R para verificar o tipo de dados de uma variável

Quantidade de visualizações: 1255 vezes
Na linguagem R nós não precisamos informar o tipo de dados de uma variável no momento de sua declaração e, consequentemente, atribuição de seu valor inicial. No entanto, a linguagem permite que as variáveis, no decorrer da execução do programa, assumam outros tipos de dados.

Dessa forma, em várias situações nós podemos precisar verificar qual o tipo de dados armazenado em um variável em um determinado momento, talvez, com o propósito de não assumir riscos durante um cálculo envolvendo inteiros e decimais.

A função class() da linguagem R recebe o nome de uma variável e nos informa o seu tipo de dados. Veja um exemplo de seu uso:

> x <- 10 [ENTER]
> class(x) [ENTER]
[1] "numeric"
> x <- "Java" [ENTER]
> class(x) [ENTER]
[1] "character"
> x <- TRUE [ENTER]
> class(x) [ENTER]
[1] "logical"
> x <- 5L [ENTER]
> class(x) [ENTER]
[1] "integer"
> 

Execute estas linhas na janela de comandos do R ou em um script e veja como a variável x assumiu, no decorrer da execução, os tipos numeric, character, logical e integer.


MySQL ::: Dicas & Truques ::: Chaves, Índices e Restrições de Integridade Referencial

Como adicionar uma chave primária a uma tabela MySQL usando o comando ALTER TABLE ADD PRIMARY KEY

Quantidade de visualizações: 8124 vezes
Em algumas situações poderá ocorrer a necessidade, talvez por motivos de manutenção na base de dados, de criar uma chave primária para uma tabela MySQL já existente. Isso pode ser feito com o auxílio do comando DDL ALTER TABLE ADD PRIMARY KEY.

Comece criando uma tabela livros sem chave primária. Veja o comando CREATE TABLE:

CREATE TABLE livros(
  id int(11) unsigned NOT NULL,
  titulo varchar(45) NOT NULL,
  paginas int(10) unsigned NOT NULL
)ENGINE=InnoDB;

Se dispararmos um comando DESCRIBE livros veremos a seguinte estrutura:

Field     Type               Null     Key    Default   Extra    
id        int(11) unsigned   NO       -      -         -      
titulo    varchar(45)        NO       -      -         -      
paginas   int(10) unsigned   NO       -      -         -
Como podemos ver, a tabela livros realmente não possui uma chave primária. Sendo assim, vamos usar o comando ALTER TABLE ADD PRIMARY KEY para adicionar uma chave primária ao campo id. Veja:

ALTER TABLE livros ADD PRIMARY KEY(id);

Dispare o comando DESCRIBE livros novamente e veja o resultado. Agora o campo id está marcado como chave primária:

Field     Type               Null     Key    Default   Extra    
id        int(11) unsigned   NO       PRI    -         -      
titulo    varchar(45)        NO       -      -         -      
paginas   int(10) unsigned   NO       -      -         -



JavaScript ::: Dicas & Truques ::: Operadores de Manipulação de Bits (Bitwise Operators)

JavaScript Avançado - Como usar o operador de bits & (E/AND sobre bits) da linguagem JavaScript

Quantidade de visualizações: 1286 vezes
O operador de bits & (E/AND sobre bits) da linguagem JavaScript é usado quando queremos comparar os bits individuais de dois valores integrais (inteiros) e produzir um terceiro resultado. Os bits no resultado serão configurados como 1 se os bits correspondentes nos dois outros valores foram 1. Em caso contrário os bits são configurados como 0.

Para quem gosta de Lógica Matemática, ou a Tabela Verdade da Lógica de Boole, vai se lembrar do conectivo "^", que diz que a proposição resultante da conjunção só será verdadeira quando as proposições simples individuais forem verdadeiras. O operador de bits & do JavaScript é similar ao conectivo "^" da Lógica Proposicional.

Vamos analisar os seguintes valores binários:

a) 0101 (5 decimal)
b) 0100 (4 decimal)

Quando aplicamos o operador & nestes dois valores teremos o seguinte resultado:

0101
0100
----
0100

Veja que o resultado é 0100, uma vez que apenas o segundo bit de cada valor está configurado como 1. Vamos ver isso em JavaScript agora. Observe o seguinte trecho de código:

<html>
<head>
  <title>Manipulação de Bits em JavaScript</title>
</head>
 
<body>

<script type="text/javascript">
  var a = 5;
  var b = 4;
  var c = a & b;
  
  // exibe o resultado (em binário e em decimal)
  document.writeln("a = " + obterBits(a) + " (" + a + ")");
  document.writeln("<br>b = " + obterBits(b) + " (" + b + ")");
  document.writeln("<br>a & b = " + obterBits(c) + " (" + c + ")");
  
  // função auxiliar que converte um decimal em sua representação em bits
  function obterBits(valor){
    var mascara = 1 << 31; // 10000000 00000000 00000000 00000000
    var buffer = ""; // um buffer para guardar os bits dos bytes
    
    for(var i = 1; i <= 32; i++){
      // compara os bits individuais dos dois valores inteiros
      if((valor & mascara) == 0){
    	buffer = buffer + "0";
      }
      else{
    	buffer = buffer + "1";
      }
      
      valor = valor << 1; // desloca uma posição para a esquerda
      // Cada troca à esquerda corresponde à multiplicação do
      // valor por 2
      
      if(i % 8 == 0){ // completou um byte?
        buffer = buffer + " ";
      }
    }
    
    return buffer;
  }
</script>

</body>
</html>


Ao executar este código teremos o seguinte resultado:

    a = 00000000 00000000 00000000 00000101 (5) 
    b = 00000000 00000000 00000000 00000100 (4)
a & b = 00000000 00000000 00000000 00000100 (4)


Carregar Publicações Anteriores


Nossas 20 dicas & truques de programação mais populares

Você também poderá gostar das dicas e truques de programação abaixo

Nossas 20 dicas & truques de programação mais recentes

Últimos Projetos e Códigos Fonte Liberados Para Apoiadores do Site

Últimos Exercícios Resolvidos

E-Books em PDF

E-Book 350 Exercícios Resolvidos de Java - PDF com 500 páginas
Domine lógica de programação e a linguagem Java com o nosso E-Book 350 Exercícios Exercícios de Java, para você estudar onde e quando quiser.

Este e-book contém exercícios resolvidos abrangendo os tópicos: Java básico, matemática e estatística, programação dinâmica, strings e caracteres, entrada e saída, estruturas condicionais, vetores e matrizes, funções, laços, recursividade, internet, arquivos e diretórios, programação orientada a objetos e muito mais.
Ver Conteúdo do E-book
E-Book 650 Dicas, Truques e Exercícios Resolvidos de Python - PDF com 1.200 páginas
Domine lógica de programação e a linguagem Python com o nosso E-Book 650 Dicas, Truques e Exercícios Exercícios de Python, para você estudar onde e quando quiser.

Este e-book contém dicas, truques e exercícios resolvidos abrangendo os tópicos: Python básico, matemática e estatística, banco de dados, programação dinâmica, strings e caracteres, entrada e saída, estruturas condicionais, vetores e matrizes, funções, laços, recursividade, internet, arquivos e diretórios, programação orientada a objetos e muito mais.
Ver Conteúdo do E-book

Linguagens Mais Populares

1º lugar: Java
2º lugar: Python
3º lugar: C#
4º lugar: PHP
5º lugar: C
6º lugar: Delphi
7º lugar: JavaScript
8º lugar: C++
9º lugar: VB.NET
10º lugar: Ruby



© 2025 Arquivo de Códigos - Todos os direitos reservados
Neste momento há 27 usuários muito felizes estudando em nosso site.