março | 2014 | Desenvolvimento Código Aberto

Arquivo de março, 2014

Websites – Escopo de Variáveis – Global e Local – JavaScript – Linux

Publicado: 27 de março de 2014 em JavaScript

Escopo

O escopo de uma variável é a região do seu código-fonte no qual a variável está definida. Uma variável global tem um escopo global, é vista em todos os lugares em seu código JavaScript. Por outro lado, as variáveis declaradas dentro de uma função são definidas somente dentro do corpo da função. Elas são variáveis locais e têm um escopo local. Os parâmetros da função também contam como variáveis locais e são definidas somente dentro do corpo da função.

Função

Em ciência da computação, no contexto da programação, uma função ou sub-rotina consiste em uma porção de código que resolve um problema muito específico e pode ser reutilizada quando necessário. O conceito de função difere da noção de procedimento, já que devolve um valor.

Escopo JavaScript

Exemplo:

Neste exemplo declaramos uma variável no espaço global do script e dentro de uma função a redeclaramos onde o espaço se torna local, deste modo podemos ver claramente como funciona o alcance de uma variável em um código JavaScript.

Html /JavaScript

<pre><!DOCTYPE html>
<html>

<head>
   <title>Desenvolvimento Aberto</title>
</head>

<body>

<h2>Desenvolvimento Aberto - Escopo</h2>
<br>
<h3>JavaScript</h3>
<br>

<pre>
<script>

var var_escopo = "variavel global";

function variavel_local() {

var var_escopo = "variavel local";

return var_escopo

}
document.writeln("A variavel var_escopo esta declarada como:\n");
document.writeln("Escopo do script: " + var_escopo);
document.writeln("Escopo da function: " + variavel_local());

</script>
</pre>

</body>

</html>

Websites – Date() – Data e Hora – JavaScript – Linux

Publicado: 27 de março de 2014 em JavaScript

Date()

Cria uma instância de data JavaScript que representa um único momento no tempo. Objetos de data são baseados em um valor de tempo que é o número de milissegundos desde 1 º de janeiro de 1970 UTC.

Objetos de data só podem ser instanciados, chamando o JavaScript Date como um construtor: chamando-o como uma função regular ou seja, sem o operador new irá retornar uma string ao invés de um objeto de data, ao contrário de outros tipos de objeto de JavaScript, objetos JavaScript Date não têm sintaxe literal .

Website – Data e Hora

Day

Representa o dia do mês de um objeto de datas.

Month.

Representa o numero do mês, corresponde a um índice iniciando no numero 0 com termino no numero 11, sendo que o mês de janeiro é representado pelo menor índice ou seja o numero zero e não mês 1.

Year

Representa o exercício de um calendário do objeto de datas.

Hours

Representa o numero de horas de um objeto de datas.

Minutes

Representa o numero de minutos de um objeto de datas.

Seconds

Representa o numero de segundos de um objeto de datas.

Exemplo:

Neste exemplo mostramos em uma pagina html vários tipos de formatos que se pode extrair de um objeto de datas.

<!DOCTYPE html>
<html>

<head>
   <title>Desenvolvimento Aberto</title>
</head>

<body>

<h2>Desenvolvimento Aberto - Data e Hora</h2>
<br>
<h3>JavaScript</h3>
<br>

<pre>
<script>

var datahora = new Date();

document.writeln("Dia: " + datahora.getDay());
document.writeln("Mes: " + datahora.getMonth());
document.writeln("Ano: " + datahora.getFullYear());
document.writeln();
document.writeln("Hora: " + datahora.getHours());
document.writeln("Minutos: " + datahora.getMinutes());
document.writeln("Segundos: " + datahora.getSeconds());
document.writeln();
document.writeln("Data: " + datahora.toString());
document.writeln();
document.writeln("Data local:" + datahora.toLocaleDateString());
document.writeln("Hora local:" + datahora.toLocaleTimeString());

</script>
</pre>

</body>

</html>

Visual – TabStrip – Screen Painter – Abap

Publicado: 26 de março de 2014 em Abap

Um controle TabStrip é um objeto de tela que consiste em duas ou mais páginas. Cada página da guia consiste em um título da guia e uma área de página. Se a área ocupada pelo controle TabStrip é muito estreita para exibir todos os títulos das guias, aparece uma barra de rolagem, o que lhe permite alcançar os títulos que não são exibidos. Há também um botão que lhe permite exibir uma lista de todos os títulos de tabulação.

Não se pode negar que o SAP R/3 possui tecnologia de ponta em muitos aspectos, mas quando você começa a se aprofundar em Abap, você nota que a linguagem possui varias funções marcadas como obsoletas pelo próprio fabricante e apesar dos contínuos investimentos da SAP em tecnologia de ponta como por exemplo dominar a tecnologia de nuvens no qual a SAP hoje é líder mundial, podemos ver claramente que ela deixou estacionado a construção ou um upgrade dos componentes visuais, principalmente se comparado com a tecnologia de outras linguagens de programação. Manter a compatibilidade com versões anteriores tudo bem e é muito comum, mas como podemos ver o TabStrip é um dos componentes visuais mais confusos da coleção de objetos Abap.

Existem dois modos de usar o TabStrip, paginando no SAPgui ou no Application Server:

Sap Gui

Você precisa atribuir uma SubScreenArea separado para cada título da guia, e definir os códigos de função dos títulos das guias com o tipo P (função GUI local). Na lógica de fluxo de tela, você deve chamar todos as telas do evento PBO. Isso significa que todas as páginas de guia residem localmente no SAPgui.

Application Server

Uma SubScreenArea é compartilhada por todos os títulos das guias e chamado no evento PBO. Você define os códigos de função dos títulos das guias individuais sem um tipo de função especial. Quando o usuário escolhe uma página da guia, o evento PAI é acionado, e você deve incluir um módulo em sua lógica de fluxo que ativa a página de guia apropriada e atribui a subtela correta para a área de subtela.

Screen Painter

Neste ponto supomos que você já saiba criar uma tela no Screen Painter , para criar um programa usando uma TabStrip siga os passos abaixo:

Crie um programa chamado Ztab na transação SE38.
Na transação SE51, crie uma tela no Screen Painter com o numero 100 para o programa Ztab e crie um PBO Module Main Program, e na aba Flow Logic digite o primeiro código abaixo, salve o programa.
Volte para a transação SE51 e clique em Layout e insira na tela um TabStrip e para cada aba insira um componente SubScreenArea, use a figura abaixo:
Screen 100
Nomeie a TabStrip de TABSTRIP, cada Aba de TAB1 e TAB2, function codes de F_TAB1 e F_TAB2.
Nomeie cada SubScreenArea de SUBS1 e SUBS2 e ligue respectivamente cada campo Ref Field de cada aba com sua SubScreenArea.
Crie uma nova Screen Painter tipo SubScreen para o programa Ztab com o numero 200, e crie seu layout como na figura abaixo:
Screen 200
Crie uma nova Screen Painter tipo SubScreen para o programa Ztab com o numero 300, e crie seu layout como na figura abaixo:
Screen 300
Ative todas as telas e volte para a SE38 e complete o código com o programa abaixo.

Exemplo:

Neste exemplo criamos uma TabStrip do lado do SAPgui e passamos o valor de um campo para outro através de uma sub-tela para uma sub-tela usando o evento onclick da guia do TabStrip. Uma dica é testar a logica de funcionamento do TabStrip no código da aba Flow Logic da tela 100, se você comentar as chamadas das sub-telas do PAI (Process After Input) não é possível passar os valores entre as guias.

Abap

Screen 100 – Flow logic

PROCESS BEFORE OUTPUT.
 MODULE STATUS_0100.
   CALL SUBSCREEN SUBS1 INCLUDING SY-REPID '200'.
   CALL SUBSCREEN SUBS2 INCLUDING SY-REPID '300'.
*
PROCESS AFTER INPUT.
MODULE USER_COMMAND_0100.
  CALL SUBSCREEN SUBS1.
  CALL SUBSCREEN SUBS2.

Programa – Ztab

*&---------------------------------------------------------------------*
*& Report  ZTAB
*&
*&---------------------------------------------------------------------*
*& Desenvolvimento Aberto
*& TabStrip
*&---------------------------------------------------------------------*

REPORT  ZTAB.

" Declara variaveis para os eventos
DATA OK_CODE LIKE SY-UCOMM.
DATA CLIQUE_OK LIKE SY-UCOMM.

" Declara componentes
DATA TEXTO1 TYPE STRING.
DATA TEXTO2 TYPE STRING.

" Declara controle do tabstrip
CONTROLS TABSTRIP TYPE TABSTRIP.

" Chama as telas
CALL SCREEN 100.
CALL SCREEN 200.
CALL SCREEN 300.

" Inicia PBO modulo 100
MODULE STATUS_0100 OUTPUT.
*  SET PF-STATUS 'xxxxxxxx'.
*  SET TITLEBAR 'xxx'.

" Limpa o evento contra possiveis sujeiras PAI
CLIQUE_OK = OK_CODE.
CLEAR OK_CODE.

" Verifica eventos dos botões - uma guia é igual a um botão
CASE CLIQUE_OK.
  WHEN 'F_TAB1'.
    TABSTRIP-ACTIVETAB = 'F_TAB1'.
    TEXTO1 = TEXTO2.
  WHEN 'F_TAB2'.
    TABSTRIP-ACTIVETAB = 'F_TAB2'.
    TEXTO2 = TEXTO1.
  WHEN 'F_SAIR'.
    LEAVE PROGRAM.
ENDCASE.

ENDMODULE.                 " STATUS_0100  OUTPUT

Visual – Menu – Separator – SubMenu – Python – Linux

Publicado: 26 de março de 2014 em Python

Em computação e telecomunicações, um menu é uma lista de opções ou comandos apresentados a um operador por um computador ou sistema de comunicações . Os menus são, por vezes, hierarquicamente organizado, permitindo uma navegação através de diferentes níveis da estrutura do menu. A seleção de um item do menu com uma seta irá expandi-lo, mostrando um segundo menu (o sub-menu) com opções relacionadas com a entrada selecionada. É possível adicionar outros componentes ao menu como ícones de imagem, um componente de botões de radio e até mesmos botões de cheque.

Menu

O Widget de menu é usado para implementar toplevel, suspensos, e pop-up menus. Este elemento é usado para exibir todos os tipos de menus usado por um aplicativo. Uma vez que esta ferramenta usa código nativo, sempre que possível, você não deve tentar menus falsos usando botões e outros widgets Tkinter.

Menu Tkinter

Exemplo:

Neste exemplo criamos um menu, um sub-menu e um separador de menu.

#!/usr/bin/env python
# -*- coding: latin-1 -*-
# Desenvolvimento Aberto
# Menu.py

# importa modulo 

from Tkinter import *

# Cria formulario
formulario = Tk()
formulario.title = "Desenvolvimento Aberto"

# Declara variaves do label
txt = StringVar()
msg = "Voce clicou no: "

# Declara eventos dos itens do menu
def menu1_1():
    txt.set(msg + "Menu 1, item 1")
    
def menu1_2():
    txt.set(msg + "Menu 1, item 2")    
    
def menu1_3():
    txt.set(msg + "Menu 1, item 3")  
    
def menu1_4():
    txt.set(msg + "Menu 1, item 4")    
    
def menu2_1():
    txt.set(msg + "Menu 2, item 1")    

# Declara label
texto = Label(formulario, textvariable= txt )

# Declara menus
barraMenu = Menu(formulario)
item1Menu = Menu(formulario, tearoff= 0)
item2Menu = Menu(formulario, tearoff= 0)
subMenu = Menu(formulario, tearoff=0)

# Adiciona Itens, SubMenus e Separadores
item1Menu.add_command(label = "Item1", command = menu1_1)
item1Menu.add_command(label = "Item2", command = menu1_2)

item1Menu.add_cascade(label="submenu", menu=subMenu)
subMenu.add_command(label = "Item3", command = menu1_3)

item1Menu.add_separator()
item1Menu.add_command(label = "Item4", command = menu1_4)
barraMenu.add_cascade(label = "Menu 1", menu = item1Menu)

item2Menu.add_command(label="item1", command= menu2_1)
barraMenu.add_cascade(label = "Menu 2", menu = item2Menu)

# Adiciona menu ao formulario
formulario.config(menu= barraMenu)
formulario.geometry("300x200")

# Posiciona label no formulario
texto.grid(row=1, sticky=W, padx=40, pady=160)

# Loop do tcl
mainloop()

Visual – MFC – CMenu – Resources – C++

Publicado: 26 de março de 2014 em C/C++

Um menu MFC em C++ pode ser criado de duas maneiras, a primeira é dinamicamente usando código C++ e mensagens do Windows derivando uma classe da CFrameWnd. Note que em MFC C++ um menu não é um componente encontrado na ToolBox e sim um Resource do Windows, então a segunda maneira de criar um menu C++ MFC é usando a janela de Resources.

CMenu

Um encapsulamento de Windows HMENU.

Resources

Este material se aplica a aplicativos de desktop baseados em Win32, visto que o conceito Win32 não é apenas para computadores 32bits e sim à referencia as APIs do Windows como já explicamos em nossos primeiros tópicos C++.

Neste caso o termo Resource pode se referir a Resource files ou seja, uma série de tipos de arquivos, incluindo:

O script recurso de arquivo (rc.), de um programa, um modelo de recurso de arquivo (. RCT), um recurso individual existente como um arquivo independente, como um arquivo de bitmap, ícone ou cursor que é referida a partir de um arquivo de rc ou um arquivo de cabeçalho gerado pelo ambiente de desenvolvimento, por exemplo Resource.h, que é referida a partir de um arquivo de rc.

Use a caixa de diálogo de Resources para adicionar um recursos a um projeto C + + em um aplicativo de desktop.

Visual Studio

Para criar e manipular um menu em C++ siga os seguintes passos:
Crie um Projeto MFC Aplicattion Dialog Based.
Na janela Solution Explorer clique na aba Resource View ou chame a janela diretamente do menu, use a imagem abaixo para referencia.
Resources
Insira o CMenu e digite seus itens como na figura acima.
Crie os eventos para os itens do menu use a imagem abaixo como referencia:
Eventos
No dialogo principal coloque no meio da janela um Edit Control e mude suas propriedades para sem bordas e apenas leitura, veja a figura abaixo:
Design Time
Olhe o código abaixo para completar o código gerado automaticamente, você deve obter um programa como este:
Programa CMenu

Exemplo:

No exemplo abaixo criamos um menu C++ MFC usando Resources, complete seu código com os trechos marcados do código abaixo para rodar o programa.

C++

// Código gerado automaticamente
// CriaMenuCppDlg.cpp : implementation file
//

#include "stdafx.h"
#include "CriaMenuCpp.h"
#include "CriaMenuCppDlg.h"
#include "afxdialogex.h"

#ifdef _DEBUG
#define new DEBUG_NEW
#endif

CCriaMenuCppDlg::CCriaMenuCppDlg(CWnd* pParent /*=NULL*/)
	: CDialogEx(CCriaMenuCppDlg::IDD, pParent)
{
	m_hIcon = AfxGetApp()->LoadIcon(IDR_MAINFRAME);
}

void CCriaMenuCppDlg::DoDataExchange(CDataExchange* pDX)
{
	CDialogEx::DoDataExchange(pDX);
	DDX_Control(pDX, IDC_EDIT1, m_texto);
}

BEGIN_MESSAGE_MAP(CCriaMenuCppDlg, CDialogEx)
	ON_WM_PAINT()
	ON_WM_QUERYDRAGICON()
	ON_COMMAND(ID_MENU1_ITEM1, &CCriaMenuCppDlg::OnMenu1Item1)
	ON_COMMAND(ID_MENU1_ITEM2, &CCriaMenuCppDlg::OnMenu1Item2)
	ON_COMMAND(ID_ITEM3_ITEM1, &CCriaMenuCppDlg::OnItem3Item1)
	ON_COMMAND(ID_MENU1_ITEM4, &CCriaMenuCppDlg::OnMenu1Item4)
	ON_COMMAND(ID_MENU2_ITEM1, &CCriaMenuCppDlg::OnMenu2Item1)
END_MESSAGE_MAP()

BOOL CCriaMenuCppDlg::OnInitDialog()
{
	CDialogEx::OnInitDialog();

	SetIcon(m_hIcon, TRUE);
	SetIcon(m_hIcon, FALSE);	

	// Desenvolvimento Aberto
	// Inicializa o menu

	CMenu menu;
	menu.LoadMenuW(IDR_MENU1);
	SetMenu(&menu);

	return TRUE;
}

void CCriaMenuCppDlg::OnPaint()
{
	if (IsIconic())
	{
		CPaintDC dc(this); 

		SendMessage(WM_ICONERASEBKGND, reinterpret_cast<WPARAM>(dc.GetSafeHdc()), 0);

		int cxIcon = GetSystemMetrics(SM_CXICON);
		int cyIcon = GetSystemMetrics(SM_CYICON);
		CRect rect;
		GetClientRect(&rect);
		int x = (rect.Width() - cxIcon + 1) / 2;
		int y = (rect.Height() - cyIcon + 1) / 2;

		dc.DrawIcon(x, y, m_hIcon);
	}
	else
	{
		CDialogEx::OnPaint();
	}
}

HCURSOR CCriaMenuCppDlg::OnQueryDragIcon()
{
	return static_cast<HCURSOR>(m_hIcon);
}

// Desenvolvimento Aberto
// Eventos do Menu

static CString msg = L"Você clicou no: ";

void CCriaMenuCppDlg::OnMenu1Item1()
{
	m_texto.SetWindowTextW(msg + "Menu 1, Item 1");

}

void CCriaMenuCppDlg::OnMenu1Item2()
{
	m_texto.SetWindowTextW(msg + "Menu 1, Item 2");
}

void CCriaMenuCppDlg::OnItem3Item1()
{
	m_texto.SetWindowTextW(msg + "Menu 1 - Sub-Menu 1, Item 1");
}

void CCriaMenuCppDlg::OnMenu1Item4()
{
	m_texto.SetWindowTextW(msg + "Menu 1, Item 4");
}

void CCriaMenuCppDlg::OnMenu2Item1()
{
	m_texto.SetWindowTextW(msg + "Menu 2, Item 1");
}

Visual – MenuStrip – ToolStripMenuItem – ToolStripSeparator – C#

Publicado: 25 de março de 2014 em C#

MenuStrip

Fornece um sistema de menus para um formulário.

ToolStripMenuItem

Representa uma opção selecionável exibida em um MenuStrip . Embora ToolStripMenuItem substitui e adiciona funcionalidade para o controle MenuItem de versões anteriores, MenuItem é mantido para compatibilidade com versões anteriores e o uso futuro, se você escolher.

ToolStripSeparator

Representa uma linha usada para agrupar itens de um ToolStrip ou os itens drop-down de um MenuStrip ou ContextMenuStrip ou outro controle ToolStripDropDown.

Exemplo:

Neste exemplo criamos um menu, seus sub-menus e eventos.

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace CriaMenu
{
    public partial class Form1 : Form
    {
        // Decllara componentes
        Label texto;

        // Declara variaveis
        string msg = "Você escolheu o item: ";
        public Form1()
        {
            InitializeComponent();
        }

        private void Form1_Shown(object sender, EventArgs e)
        {
            // Adiciona valores as propriedades dos componentes
            texto = new Label();
            texto.Text = msg;
            texto.Size = new Size(300, 20);
            texto.Location = new Point(5,150);

            Form1.ActiveForm.Text = "Strip Menu";

            // Cria barra de Menu
            MenuStrip menu = new MenuStrip();

            // Cria menu
            ToolStripMenuItem itens1 = new ToolStripMenuItem("Menu 1");
            ToolStripMenuItem itens2 = new ToolStripMenuItem("Menu 2");

            // Cria sub-menu
            ToolStripMenuItem subitens1 = new ToolStripMenuItem("Item 3 - Sub-Menu 1");

            // Cria itens do menu
            ToolStripMenuItem m1item1 = new ToolStripMenuItem("Item 1", null, new EventHandler(clique1_m1));
            ToolStripMenuItem m1item2 = new ToolStripMenuItem("Item 2", null, new EventHandler(clique2_m1));
            ToolStripMenuItem m1item3 = new ToolStripMenuItem("Sub Item 3", null, new EventHandler(clique3_m1));
            ToolStripMenuItem m1item4 = new ToolStripMenuItem("Item 4", null, new EventHandler(clique4_m1));

            ToolStripMenuItem m2item1 = new ToolStripMenuItem("Item 1", null, new EventHandler(clique1_m2));

            // Adiciona itens ao menu
            itens1.DropDownItems.Add(m1item1);
            itens1.DropDownItems.Add(m1item2);
            itens1.DropDownItems.Add(subitens1);

            // Adiciona sub-menu
            subitens1.DropDownItems.Add(m1item3);

            // Adiciona separador
            itens1.DropDownItems.Add(new ToolStripSeparator());

            // Adiciona itens ao menu
            itens1.DropDownItems.Add(m1item4);
            itens2.DropDownItems.Add(m2item1);

            // Adiciona itens a barra de menu
            menu.Items.Add(itens1);
            menu.Items.Add(itens2);

            // Adiciona componentes ao formulario
            Form1.ActiveForm.Controls.Add(menu);
            Form1.ActiveForm.Controls.Add(texto);

        }

        // Cria eventos do menu
        private void clique1_m2(object sender, EventArgs e)
        {
            texto.Text = msg + "Menu 2, item 1";
        }

        private void clique1_m1(object sender, EventArgs e)
        {
            texto.Text = msg + "Menu 1, item 1";
        }

        private void clique2_m1(object sender, EventArgs e)
        {
            texto.Text = msg + "Menu 1, item 2";
        }

        private void clique3_m1(object sender, EventArgs e)
        {
            texto.Text = msg + "Menu 1, item3 - Sub-item 1";
        }

        private void clique4_m1(object sender, EventArgs e)
        {
            texto.Text = msg + "Menu 1, item 4";
        }

    }
}

Visual – JMenuBar, JMenu – JSeparator – JMenuItem – Java

Publicado: 25 de março de 2014 em Java

JMenubar

Uma implementação de uma barra de menu. Você pode adicionar objetos JMenu para a barra de menu para a construção de um menu.

JMenu

Uma implementação de um menu – uma janela pop-up contendo JMenuItems que é exibido quando o usuário seleciona um item no JMenuBar. Um JMenu também pode conter JSeparators.

JSeparator

JSeparator fornece um componente de uso geral para a implementação de linhas divisórias – mais comumente usado como um divisor entre os itens de menu que os divide em grupos lógicos.

JMenuItem

Uma implementação de um item em um menu. Um item de menu é essencialmente um botão em uma lista. Quando o usuário seleciona o botão, a ação associada ao item de menu é executado.

Exemplo:

Neste exemplo criamos um menu com seus sub-menus e seus respectivos eventos.

Java

import java.awt.BorderLayout;
import java.awt.Container;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.KeyEvent;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;

import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JMenu;
import javax.swing.JMenuBar;
import javax.swing.JMenuItem;
import javax.swing.JPanel;
import javax.swing.JPopupMenu;

public class CriaMenu
{
	// Declara componentes
	JLabel texto;

	// Cria o menu completo
	public JMenuBar criaMenu()
	{
		// Declara componentes do menu genericamente
		JMenuBar barraMenu;
		JMenu menu;
		JMenu submenu;
		JMenuItem menuItem;

		// Cria barra do Menu
		barraMenu = new JMenuBar();

		// Cria menu
		menu = new JMenu("Menu 1");

		// Adiciona menu a barra
		barraMenu.add(menu);

		// Cria item do menu
		menuItem = new JMenuItem("Item do Menu 1", KeyEvent.VK_I);

		// Cria evento do item
		menuItem.addActionListener(new ActionListener()
		{

			@Override
			public void actionPerformed(ActionEvent e)
			{
				texto.setText("Você cliquou no item: 1 do menu 1");

			}
		});

		// Adiciona item ao Menu
		menu.add(menuItem);

	    // Repete processo para o segundo item
		menuItem = new JMenuItem("Item do Menu 2", KeyEvent.VK_T);
		menuItem.addActionListener(new ActionListener()
		{

			@Override
			public void actionPerformed(ActionEvent e)
			{
				texto.setText("Você cliquou no item: 2 do menu 1");

			}
		});

		menu.add(menuItem);

		// Repete processo para o terceiro item
		menuItem = new JMenuItem("Item do Menu 3", KeyEvent.VK_E);
		menuItem.addActionListener(new ActionListener()
		{

			@Override
			public void actionPerformed(ActionEvent e)
			{
				texto.setText("Você cliquou no item: 3 do menu 1");

			}
		});
		menu.add(menuItem);

		// Adiciona um separador de menu
		menu.addSeparator();

		// Repete processo para o quarto item
		menuItem = new JMenuItem("Item do Menu 4", KeyEvent.VK_M);
		menuItem.addActionListener(new ActionListener()
		{

			@Override
			public void actionPerformed(ActionEvent e)
			{
				texto.setText("Você cliquou no item: 4 do menu 1");

			}
		});
		menu.add(menuItem);

		// SubMenu
		// para criar um submenu cria-se um novo menu.
		// e adiciona um item 

		// Cria um submenu (novo menu)
		submenu = new JMenu("Item com Submenu");

		// Cria um item e seu evento
     	menuItem = new JMenuItem("Item do Submenu", KeyEvent.VK_U);
		menuItem.addActionListener(new ActionListener()
		{

			@Override
			public void actionPerformed(ActionEvent e)
			{
				texto.setText("Você cliquou no item: 1 do sub menu");

			}
		});

		// Adiciona item ao submenu
		submenu.add(menuItem);

		// Adiciona submenu ao menu
		menu.add(submenu);

		// Cria um segundo menu
		menu = new JMenu("Menu 2");

		// Cria item para o segundo menu e seu evento
		menuItem = new JMenuItem("Item do menu 2", KeyEvent.VK_D);
		menuItem.addActionListener(new ActionListener()
		{

			@Override
			public void actionPerformed(ActionEvent e)
			{
				texto.setText("Você cliquou no item: 1 do menu 2");

			}
		});

		// Adiciona item ao menu
		menu.add(menuItem);

		// Adiciona menu a barra de menus
		barraMenu.add(menu);

		// retorna menu completo
		return barraMenu;

	}

	// Cria um painel
	public Container criaPainel()
	{
		// Cria painel e suas propriedades
		JPanel painel = new JPanel(new BorderLayout());
		painel.setOpaque(true);

		// Cria um componente de texto
		texto = new JLabel("Você cliquou no item:");

	    // Adiciona componente ao painel
		painel.add(texto, BorderLayout.PAGE_END);

		/// Retorna Painel
		return painel;
	}

	// Cria GUI
	public static void criaGUI()
	{
		// Cria formulario e suas propriedades
		JFrame formulario = new JFrame("Desenvolvimento Aberto");
		formulario.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

		// Cria Menu
		CriaMenu menu = new CriaMenu();

		// Adiciona barra de menus na GUI
		formulario.setJMenuBar(menu.criaMenu());

		// Adiciona painel na GUI
		formulario.setContentPane(menu.criaPainel());

		// Adiciona propriedades ao formulario
		formulario.setSize(400, 300);
		formulario.setVisible(true);		

	}

	public static void main(String[] args)
	{
		javax.swing.SwingUtilities.invokeLater(new Runnable() {

			@Override
			public void run()
			{

				// Monta GUI
				criaGUI();
			}
		});

	}

}

Websites – Html Básico – Document, Var, Write e Writeln – Javascript – Linux

Publicado: 24 de março de 2014 em JavaScript

As instruções abaixo iniciam você ao mundo da programação web, mostrando como é estruturado um documento Html e como funciona a utilização de Javascript para manipular o documento dinamicamente. Esta categoria do site é multiplataforma apesar de nossa apresentação ser para Linux.

Html Básico

A declaração <DOCTYPE> deve ser a primeira coisa em seu documento HTML, antes da tag <html>. O <! DOCTYPE> não é uma tag HTML, é uma instrução para o navegador da web sobre qual é a versão do HTML da página.

A tag <h1> à <h6> significa header ou titulo, é usada para destacar um titulo em uma pagina HTML.

A tag <p> cria um paragrafo, tornando possível nomear o paragrafo e designar suas propriedades.

A tag <br> insere uma linha em branco, em HTML a tag <br> não precisa ser encerrada com a </br>, porem em XHTML o fechamento é necessário.

A tag <pre> define um texto pré-formatado. O texto em um elemento <pre> é exibido em uma fonte de largura fixa, e preserva os espaços e quebras de linha.

A tag <script> é usada para definir um script do lado do cliente, como um JavaScript. O elemento <script> ou contém declarações de script, ou ele aponta para um arquivo de script externo através do atributo src. Os usos comuns para JavaScript são de manipulação de imagem, validação de formulário, e as mudanças dinâmicas do conteúdo.

JavaScript

Ponto e vírgula separa instruções JavaScript. Normalmente você adicionar um ponto e vírgula no final de cada instrução executável. Usando ponto e vírgula também torna possível escrever muitas declarações em única uma linha.

Document

O objeto document nos dá acesso a muitos elementos encontrados na página HTML, inclusive à própria página.

Var

O comando var declara uma variável em javascript.

Write e Writeln

Write é uma instrução básica do javascript para imprimir um texto no documento e Writeln imprime o texto e efetua uma quebra de linha.

Exemplo:

Neste exemplo criamos uma pagina básica usando html e javascript. para escrever textos armazenados dentro de variáveis javascript. A figura abaixo ilustra o resultado do script deste exemplo:

Website básico

Html / JavaScript

<!DOCTYPE html>
<html>

<head>
   <title>Desenvolvimento Aberto</title>
</head>

<body>

<h1> h1 - Desenvolvimento Aberto</h1>
<h2> h2 - Desenvolvimento Aberto</h2>
<h3> h3 - Desenvolvimento Aberto</h3>
<h4> h4 - Desenvolvimento Aberto</h4>
<h5> h5 - Desenvolvimento Aberto</h5>
<h6> h6 - Desenvolvimento Aberto</h6>

<br>
<p>Este texto foi escrito em um paragrado HTML</p>
<br>

<pre>
<script>
var texto = "Este texto foi escrito em JavaScript\n";
var numero = 10;
var decimal = 25.5;
var linha = "\n";

document.write(texto + linha);
document.write("numero: " + numero.toString() + linha);
document.write("decimal: " + decimal.toString() + linha);
</script>
</pre>

</body>

</html>

Visual – Menu Painter – Screen Painter – Input/Output Field, CheckBox, RadioButton – Database Off – Abap

Publicado: 24 de março de 2014 em Abap

Trabalhar com o banco de dados SAP conectado aos componentes do Screen Painter é relativamente bem fácil, pois o engine do Screen Painter faz quase todo o trabalho para você, reconhecendo os componentes para cada tipo de campo do dicionário de dados e quando é possível lhe questiona se deseja uma conversão de um componente básico para outro mais adequado ao tipo de campo usado, e além disso lhe da botões de chamadas para pesquisas de campos que contem uma chave estrangeira.

Trabalhar com os componentes desconectados do banco de dados é um pouco diferente, pois você precisa controlar e referenciar os componentes criados na janela de design direto de seu código Abap. Diferentemente de outras linguagens de programação onde você referencia o objeto diretamente pelo nome do componente ou pelo seu ID, o Abap não possui uma unidade de código para o design gerado, que normalmente contém o nome dos componentes e suas propriedades e eventos, deste modo não é possível referenciar automaticamente os componentes em um programa Abap.

Para resolver esta situação o Abap exige que o programador crie variáveis com o mesmo nome do componente criado no Screen Painter e possui uma Function Code que dispara o evento PAI chamada SY-UCOMM que contem as funções que você nomeou nas propriedades dos seus componentes. Mas em seus programas ABAP, você deve trabalhar com o campo OK_CODE em vez de usar diretamente o sy–ucomm, você deve sempre inicializar o campo OK_CODE em um programa ABAP pelo seguinte motivo, é preciso limpar este campo para garantir que o código de função de uma tela não esteja preenchido no evento PBO, com um valor indesejado. Esta limpeza é importante quando o próximo evento PAI for disparado com um código de função vazia (por exemplo, usando ENTER).

Menu Painter/ Screen Painter

Na transação SE38 crie um programa chamado Z_ZVISUAL_CODIGO.
Na transação SE41 Crie um titulo chamado ZVISUAL_CODIGO, use a imagem abaixo para referencia:
Crie um menu com o nome de 100.
Coloque o nome do menu de “Visual + Código” e preencha os campos Code com o nome das funções dos botões que serão criados posteriormente: F_ACAO, F_LIMPAR, F_SAIR, use a imagem abaixo para referencia:
Salve e Ative o menu status 100.
Entre na transação SE51.
Na aba Flow Logic crie o PBO Module e salve o programa.
De volta na SE51 crie o seguinte design:
Na propriedade Name coloque TCAMPO1, e TCAMPO2 para os Input/Output Fields, TRADIO1 e TRADIO2 para os RadioButtons e TCHECK1 e TCHECK2 para os Checkbox.
Nomeie os botões de TACAO, TLIMPAR e TSAIR e para seus Function Codes nomeie como F_ACAO, F_LIMPAR e F_SAIR.
Salve e ative a tela de layout.
Entre na transação SE38 e complete o seu programa com o código abaixo, você deve obter o seguinte resultado:

Exemplo:

Neste exemplo criamos um programa Abap que chama um menu e uma tela visual, onde controlamos seus componentes via codificação.

Abap

*&---------------------------------------------------------------------*
*& Report  ZVISUAL_CODIGO
*&
*&---------------------------------------------------------------------*
*& Desenvolvimento Aberto
*& Visual + código
*&---------------------------------------------------------------------*

REPORT  ZVISUAL_CODIGO.

" Declara variaveis para os componetes
DATA TCAMPO1 TYPE string.
DATA TCAMPO2 TYPE string.

DATA TRADIO1 TYPE C LENGTH 1.
DATA TRADIO2 TYPE C LENGTH 1.

DATA TCHECK1 TYPE C LENGTH 1.
DATA TCHECK2 TYPE C LENGTH 1.

" Declara variaveis para os eventos
DATA OK_CODE LIKE SY-UCOMM.
DATA CLIQUE_OK LIKE SY-UCOMM.

" Chama tela visual
CALL SCREEN 100.

MODULE STATUS_0100 OUTPUT.

  " Chama o menu e o tilulo da tela
  SET PF-STATUS '100'.
  SET TITLEBAR 'ZVISUAL_CODIGO'.

" Limpa o evento contra possiveis sujeira PAI
CLIQUE_OK = OK_CODE.
CLEAR OK_CODE.

" Dedfine eventos dos botões
CASE CLIQUE_OK.
  WHEN 'F_ACAO'.

    " Verifica se o grupo foi clicado
    CASE 'RADIO'.
       IF TRADIO1 EQ 'X'.
         TCAMPO1 = 'Você selecionou o Radio Button numero 1'.
       ENDIF.

       IF TRADIO2 EQ 'X'.
         TCAMPO1 = 'Você selecionou o Radio Button numero 2'.
       ENDIF.
    ENDCASE.

    " Verifica CheckBoxes
    IF TCHECK1 EQ 'X'.
      TCAMPO1 = 'Você selecionou o CheckBox 1'.
    ENDIF.

    IF TCHECK2 EQ 'X'.
      TCAMPO2 = 'Você selecionou o CheckBox 2'.
    ENDIF.

  " Limpa campos
  WHEN 'F_LIMPAR'.
    CLEAR :
        TCAMPO1,
        TCAMPO2,
        TCHECK1,
        TCHECK2,
        TRADIO1,
        TRADIO2.

  " Sai do programa
  WHEN 'F_SAIR'.
    LEAVE PROGRAM.
ENDCASE.

ENDMODULE.                 " STATUS_0100  OUTPUT

Introdução a Websites – Apache – BlueFish e Firefox – Triologias de Programação Web – Linux – JavaScript

Publicado: 23 de março de 2014 em JavaScript, Linux

Programar para Web consiste basicamente em duas triologias distintas, a primeira de ferramentas necessárias para criar e rodar um website, um Servidor Web, uma IDE de desenvolvimento de scripts e um Navegador para interpretar os scripts. A segunda triologia consiste nas técnicas básicas de desenvolvimento na qual o desenvolvedor deve conhecer os scripts: Html, Css e Javascript. Nosso objetivo aqui é programar websites direcionados para o sistema operacional Linux, mas o conteúdo deste Walktrhought é multiplataforma.

HTML

Abreviação para a expressão inglesa HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto, é uma linguagem de marcação utilizada para produzir páginas na Web. Documentos HTML podem ser interpretados por navegadores. A tecnologia é fruto da junção entre os padrões HyTime e SGML.

Todo documento HTML possui etiquetas (do inglês: tags), palavras entre parênteses angulares (< e >) ou sinal de menor e maior; essas etiquetas são os comandos de formatação da linguagem. Um elemento é formado por um nome de etiqueta (tag), atributos, valores e filhos (que podem ser outros elementos ou texto). Os atributos modificam os resultados padrões dos elementos e os valores caracterizam essa mudança.

CSS

Cascading Style Sheets (ou simplesmente CSS) é uma linguagem de folhas de estilo utilizada para definir a apresentação de documentos escritos em uma linguagem de marcação, como HTML ou XML. Seu principal benefício é prover a separação entre o formato e o conteúdo de um documento.

Em vez de colocar a formatação dentro do documento, o desenvolvedor cria um link (ligação) para uma página que contém os estilos, procedendo de forma idêntica para todas as páginas de um portal. Quando quiser alterar a aparência do portal basta portanto modificar apenas um arquivo.

JavaScript

É a linguagem de programação da Web. A esmagadora maioria dos sites modernos usam JavaScript, e todos os modernos navegadores web, desktops, jogos consoles, tablets e smartphones também usam JavaScript.

JavaScript foi criado pela Netscape nos primórdios da Web, e tecnicamente, o JavaScript é uma marca licenciada da Sun Microsystems comprada pela Oracle utilizado para desenvolver o Netscape agora Mozilla. A linguagem foi padronizada pelo selo europeu EMCA.

Firefox

Mozilla Firefox é um navegador livre e multiplataforma desenvolvido pela Mozilla Foundation com ajuda de centenas de colaboradores. A intenção da fundação é desenvolver um navegador leve, seguro, intuitivo e altamente extensível. Baseado no componente de navegação da Mozilla Suite (continuada pela comunidade como Seamonkey), o Firefox tornou-se o objetivo principal da Mozilla Foundation. Anteriormente o navegador juntamente com o Mozilla Thunderbird, outro produto da Mozilla Foundation eram os destaques da mesma. Cerca de 40% do código do programa foi totalmente escrito por voluntários.

O Firefox já vem instalado no Ubuntu, caso esteja usando outro sistema operacional visite:

http://www.mozilla.org/pt-BR/firefox/new/

HTTPD – Apache2 Web Server

O servidor Apache é o mais bem sucedido servidor web livre. Foi criado em 1995 por Rob McCool, então funcionário do NCSA (National Center for Supercomputing Applications). Numa pesquisa realizada em dezembro de 2007 , foi constatado que a utilização do Apache representa cerca de 47.20% dos servidores ativos no mundo. Em maio de 2010, o Apache serviu aproximadamente 54,68% de todos os sites e mais de 66% dos milhões de sites mais movimentados. É a principal tecnologia da Apache Software Foundation, responsável por mais de uma dezena de projetos envolvendo tecnologias de transmissão via web, processamento de dados e execução de aplicativos distribuídos.

http://httpd.apache.org/

Como Instalar o Apache

Para instalar o Apache2 digite no terminal:


sudo apt-get install apache2

Para testar o apache entre no browser e digite o endereço: localhost

BlueFish

Bluefish é um poderoso editor voltado para programadores e webdevelopers, com muitas opções para escrever websites, scripts e códigos de programação. Bluefish suporta muitas linguagens de programação e de marcação. Bluefish é um projeto de desenvolvimento de código aberto, lançado sob a licença GNU GPL.

Bluefish é uma aplicação multi-plataforma que roda na maioria dos sistemas operacionais de desktop, incluindo Linux, FreeBSD, Mac OS-X, Windows, OpenBSD e Solaris.

http://bluefish.openoffice.nl/

Como Instalar o Bluefish


sudo apt-get install bluefish

Depois de instalado o BlueFish deve parecer como a imagem abaixo:

Estrutura HTML

<html>: define o início de um documento HTML e indica ao navegador que todo conteúdo posterior deve ser tratado como uma série de códigos HTML.
<head>: define o cabeçalho de um documento HTML, que traz informações sobre o documento que está sendo aberto.
<body>: define o conteúdo principal, o corpo do documento. Esta é a parte do documento HTML que é exibida no navegador. No corpo podem-se definir atributos comuns a toda a página, como cor de fundo, margens, e outras formatações.

Como Criar Um Website Em Um WebServer Apache Linux

Crie o diretorio: /home/user1/DesenvolvimentoAberto/Sites/devaberto, onde /home/user1 é o seu diretório do Linux.
Abra o Blufish e selecione o diretorio devaberto.
Crie um novo projeto chamado DesenvolvimentoAberto
Escreva o código html abaixo e salve com o nome de index.html
Clique no icone da barra de ferramentas chamado Antever no navegador, você deve obter um site como na imagem abaixo.
Preste atenção no endereço da Url da imagem acima, você esta testando localmente no diretório definido por nós, agora precisamos efetuar um Upload do site para o servidor web Apache.
Abra uma janela do terminal e digite a linha de comando: “sudo chown user1.users /var/www“, onde user1 é o seu usuário do Linux.
Depois digite a segunda linha de comando: “sudo chown user1.users /var/www/index.html“.
Dependendo da versão do Apache o arquivo index.html pode estar dentro da pasta html, adicione a pasta no caminho mostrado acima conforme sua versão do Apache.
No menu Arquivo, clique em Upload/Download, coloque o diretório do site local no qual criamos na opção diretório local e o diretório remoto na opção seguinte.
O diretório remoto em nosso caso é nosso servidor web, que por default esta localizado no sistema de arquivos Linux em: “/var/www“.
Clique no botão Upload, use a imagem abaixo para referencia.
Abra o Firefox e digite: localhost, você deve obter o site rodando no seu servidor web como na figura abaixo

HTML

<html>
   <head>
      <title>Desenvolvimento Aberto</title>
   </head>
<body>
          Desenvolvimento Aberto

<br></br>

<h1>Hello World Wide Web!!!</h1>

</body>
</html>

Como aprender Html / Javascript neste site?

Após instalar o Apache e o BlueFish, no menu categorias clique em JavaScript e vá para o primeiro post, cada post contem uma teoria e um código fonte, siga os em ordem decrescente ou seja do ultimo para o mais recente, o post mais antigo contem as primeiras lições e como usar a IDE BlueFish, continue acompanhando o site para se atualizar e aprender mais sobre JavaScript.

Desenvolvimento Código Aberto

Arquivos

Categorias

Mais Acessados

Recomendados

Translate

Downloads

Desenvolvimento Aberto

Uteis

Visualizações

Comentários

Arquivo de março, 2014

Websites – Escopo de Variáveis – Global e Local – JavaScript – Linux

Websites – Date() – Data e Hora – JavaScript – Linux

Visual – TabStrip – Screen Painter – Abap

Visual – Menu – Separator – SubMenu – Python – Linux

Visual – MFC – CMenu – Resources – C++

Visual – MenuStrip – ToolStripMenuItem – ToolStripSeparator – C#

Visual – JMenuBar, JMenu – JSeparator – JMenuItem – Java

Websites – Html Básico – Document, Var, Write e Writeln – Javascript – Linux

Visual – Menu Painter – Screen Painter – Input/Output Field, CheckBox, RadioButton – Database Off – Abap

Introdução a Websites – Apache – BlueFish e Firefox – Triologias de Programação Web – Linux – JavaScript

Autores

Digite uma palavra chave para uma busca