Broculos.net

SharePoint 2010 Branding: Master page invalida em sites non-publishing

dsilva — Mon, 12 Mar 2012 10:30:06 +0000

Ao criar-se um novo site non-publishing vai aparecer um erro da master page ("The site master page setting currently applied to this site is invalid. Please select a new master page and apply it") e a master page usada passa a ser a v4.master. Isto apenas acontece se o site raiz for um site publishing. Tambem é graças ao site raiz ser um publishing site que podemos navegar até à pagina de configuração da master page através do url /_layouts/changesitemasterpage.aspx e ver o referido erro.

Esta poderá ser a razão pela qual, por omissão, não é possível criar sites non-publishing dentro de um site publishing... No entanto, as pessoas precisam e querem usar estes site templates, por isso é necessário encontrar uma solução para este problema.

Se estiver a usar as master page standard não vai notar nenhum problema, visto que apesar do erro o site usará a master page v4. O problema surge quando se pretende usar uma master page personalizada, por causa dos problemas de herança o CSS vai ser usado, as master pages não.

Quando a herança é manualmente activada na pagina de configuração da master page o erro desaparece e os estilos do site funcionam correctamente, mas não posso pedir a todos os clientes que reproduzam estes passos manualmente sempre que quiserem usar um site template non-publishing. Por isso criei uma feature que activa as opções e outra que faz o stapling da feature de herança aos site templates que necessito. Esta funcionalidade pode ser reutilizada em todos os meus projectos.

Feature para a herança

Esta feature é activada ao nível (scope) Web. O mais importante da feature está no seu event receiver. O código é claro, as três propriedades de herança que se encontram na página de configuração da master page são activadas.

public override void FeatureActivated(SPFeatureReceiverProperties properties)
{
	SPWeb web = (SPWeb)properties.Feature.Parent;
	
	if (!web.IsRootWeb) 
	{
		Hashtable hash = web.AllProperties;
		web.MasterUrl = web.ParentWeb.MasterUrl;
		hash["__InheritsMasterUrl"] = "True";

		web.CustomMasterUrl = web.ParentWeb.CustomMasterUrl;
		hash["__InheritsCustomMasterUrl"] = "True";

		web.AlternateCssUrl = web.ParentWeb.AlternateCssUrl;
		hash["__InheritsAlternateCssUrl"] = "True";

		web.Update();
	}
}

Feature de stapling

Nesta feature associa-se a feature de herança aos site templates desejados. Em baixo encontra-se um exemplo de como activar a feature para o site template Team Site.

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">  
	<FeatureSiteTemplateAssociation Id="00000000-0000-0000-0000-000000000000" TemplateName="STS#0" />
</Elements>

Redireccionamento de websites no IIS 6

nunof — Sun, 15 Jan 2012 18:02:48 +0000

Por vezes quando trabalhamos num website com vários domínios (org, com, net, etc.), queremos que os domínios secundários redireccionem para o domínio principal. É fácil de fazer isto no IIS (IIS 6, sem módulos necessários). O IIS tem um módulo rewrite embutido que permite redireccionar para um URL específico.

Também é possível ter vários URLs mapeados para o mesmo website no IIS, mas não é isto que queremos, porque precisamos que os URLs secundários redireccionem de facto para o URL principal (por exemplo transformando automaticamente domain.org/something em www.domain.com/something).

É necessário criar um website no IIS para os redirects (todos os URLs secundários podem ser mapeados para este mesmo website no IIS, para assim podermos aplicar a regra de redirect a todos eles ao mesmo tempo). Podem usar a mesma configuração do site principal. A directoria que escolhem no sistema de ficheiros não interessa, pois será alterada mais tarde.

Como configurar o redireccionamento no IIS:

Abrir as propriedades do website onde se vai configurar a redirecção.
Abrir a tab Home Directory.
Escolher A redirection to a URL.
- Escrever o URL para onde redireccionar (por exemplo http://www.example-new.com$S$Q - reparem nos parâmetros e na falta de barras).
Activem The exact URL entered above.
Activem A permanent redirection for this resource se quiserem um redirect permanente (301) ou deixem desactivado para um redirect temporário (302).

Os parâmetros depois do URL principal dizem ao IIS para redireccionar para o mesmo caminho e com a mesma query string que foram pedidos. Podem ver em mais detalhes sobre o que cada parâmetro faz na referência de Redirect do IIS 6.

Google Currents: Edição do Broculos.net

nunof — Sun, 18 Dec 2011 21:57:51 +0000

Acabamos de criar a nossa edição do Google Currents com o conteúdo deste blog e com a nossa actividade no Google+.

O Google Currents é um leitor de notícias para dispositivos Android e iOS. Tem um layout simples onde o conteúdo se adapta ao dispositivo. Cada publicação pode ser uma combinação de feeds, media e canais sociais. Uma das funcionalidades mais úteis do Google Currents é a sua capacidade para guardar os artigos para leitura offline, podendo assim serem lidos em qualquer lado.

Para subscrever à nossa edição do Google Currents primeiro instale a aplicação do Google Currents e depois siga este link no seu dispositivo.

Android 101: Publicar no mercado Android

dsilva — Wed, 14 Dec 2011 10:00:48 +0000

Anterior: Como criar um widget StackView

Embora tenhamos optado por não publicar a aplicação Honeybuzz no mercado (por razões óbvias), ainda aprendemos algumas coisas que poderão ser úteis a qualquer programador Android.

A sua aplicação no Android Market

Agora que terminou a primeira versão da sua aplicação e está pronto a publicá-la no mercado, não pode ignorar os dados que coloca na página da sua aplicação no Android Market. Deverá colocar tanto esforço nesta informação como o esforço que dedicou à criação da aplicação. O utilizador pode decidir não descarregar a aplicação se:

A descrição da aplicação for pobre, tiver erros ortográficos e/ou não descrever claramente o que a aplicação faz.
Tiver poucos screenshots, as imagens tiverem má qualidade ou se não tiver screenshots das funcionalidades principais da aplicação.
O logótipo, nome da aplicação ou nome do criador parecer fictício, pouco profissional ou foleiro.

Esta informação pode fazer toda a diferença no sucesso da sua aplicação. Se o utilizador encontrar uma página confusa ou pouco profissional, ele irá simplesmente procurar outra aplicação que lhe pareça mais confiável e que faça o mesmo que a sua. Não deite a perder todo o tempo que gastou a desenvolver uma aplicação só porque não quer gastar mais algum tempo a construir uma boa descrição ou a tirar screenshots de qualidade. Estes pormenores fazem mesmo a diferença.

O logótipo: Amor à primeira vista?

Se um utilizador procurar por “note taking app” vão surgir centenas de resultados. Qual será a aplicação que o utilizador escolherá? Qual seria a que você escolheria?

Possivelmente escolheria a aplicação com o logótipo com melhor aspecto e com o nome que lhe soasse melhor. Entre tantas opções o utilizador tem de fazer generalizações e suposições baseando-se nos 10 segundos que passa a olhar para os resultados da pesquisa.

Veja estes recursos com mais informações sobre como criar um óptimo logótipo para a sua aplicação:

Aplique-se na criação da descrição da aplicação

Estude o mercado. Leia as paginas das aplicações que concorrem com a sua. Não basta fazer o que eles fazem, dê um passo adiante. Se os seus concorrentes têm apenas screenshots da aplicação, adicione uma demonstração em vídeo da sua.
Descrição acima da dobra. Se tiver uma descrição grande da sua aplicação esta será colapsada na página do mercado. O utilizador pode ou não expandi-la para ler todo o conteúdo. Certifique-se de transmitir o objectivo principal da aplicação acima da dobra. Diga ao utilizador porque deve descarregar a sua aplicação.
Descreva todas as funcionalidades principais da sua aplicação.
Não tenha medo de se gabar. Se a sua aplicação ganhou um prémio ou foi referida positivamente numa publicação de renome, diga-o. Este tipo de informação dá ao utilizador confiança na qualidade da sua aplicação.

Mais recursos

Android 101: Como criar um widget StackView

nunof — Mon, 12 Dec 2011 10:16:10 +0000

Anterior: Como monetizar uma aplicação Android

Widgets são uma boa ferramenta para os utilizadores personalizarem o ecrã principal do seu dispositivo. É uma boa forma de aumentar o interesse numa aplicação. Um widget pode fornecer bastante informação de forma sucinta e mostrar atalhos para acções comuns.

O Honeycomb introduziu widgets para colecções. Como o nome implica, são capazes de mostrar vários itens. Existem vários tipos de widgets para colecções:

ListView: uma lista vertical de itens (e.g. o widget do Gmail).
GridView: uma lista vertical com duas colunas (e.g. o widget dos bookmarks).
StackView: uma vista de cartas empilhadas, onde o item da frente pode ser passado à frente para dar lugar ao item a seguir (e.g. o widget do Market).
AdapterViewFlipper: anima entre vistas, apenas mostrando uma de cada vez.

Vou explicar como fizemos o widget para a aplicação Honeybuzz. É um widget StackView e mostra os Buzzes com uma foto do autor e uma porção do texto.

Adicionar o widget ao manifesto

É necessário que o widget esteja declarado no manifesto da aplicação. Como estamos a usar um widget StackView, temos que especificar tanto um widget provider como um widget service.

<application>

	<!-- StackWidget Provider -->
	<receiver android:name="StackWidgetProvider">
		<intent-filter>
			<action android:name="android.appwidget.action.APPWIDGET_UPDATE" />
		</intent-filter>
		<meta-data
			android:name="android.appwidget.provider"
			android:resource="@xml/stackwidgetinfo" />
	</receiver>
	
	<!-- StackWidget Service -->
	<service android:name="StackWidgetService"
		android:permission="android.permission.BIND_REMOTEVIEWS"
		android:exported="false" />

</application>

Como criar um widget provider

Para o widget provider, temos de especificar a informação necessária e criar a implementação da classe.

A informação do provider é apenas um ficheiro XML que se cria na pasta res\xml. Este é o ficheiro da aplicação Honeybuzz:

<?xml version="1.0" encoding="utf-8"?>
<appwidget-provider
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:minWidth="220dp"
  android:minHeight="220dp"
  android:updatePeriodMillis="1800000"
  android:initialLayout="@layout/stackwidget"
  android:autoAdvanceViewId="@id/stackWidgetView"
  android:previewImage="@drawable/stackwidget_preview">
</appwidget-provider>

A maioria dos atributos são auto-explicativos. O atributo updatePeriodMillis define o intervalo de actualização do provider. O mínimo possível são 15 minutos, mas deve-se actualizar o menos frequentemente possível, de forma a conservar bateria.

Para determinar o tamanho do widget podem usar a seguinte fórmula (encontrada no site Android Developers):

(número de células * 74) - 2

Portanto, se quiserem um widget 3 por 3 como na aplicação Honeybuzz:

(3 * 74) - 2 = 220

O layout de um widget é parecido com um layout de uma Activity, mas é muito mais restritivo. Baseiam-se em RemoteViews e as classes de layout e das vistas que se podem usar são limitadas (principalmente antes do Honeycomb, onde vistas com scrolling não eram possíveis para widgets).

O layout para um widget StackView pode ser tão simples quanto o seguinte:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <StackView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/stackWidgetView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:loopViews="true" />
    <TextView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/stackWidgetEmptyView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="@string/no_activities"
        android:background="@drawable/stackwidget_background"
        android:gravity="center"
        android:textColor="#ffffff"
        android:textStyle="bold"
        android:textSize="16sp" />
</FrameLayout>

E a implementação da classe do widget provider:

public class StackWidgetProvider extends AppWidgetProvider {
    @Override
    public void onDeleted(Context context, int[] appWidgetIds) {
        super.onDeleted(context, appWidgetIds);
    }

    @Override
    public void onDisabled(Context context) {
        super.onDisabled(context);
    }

    @Override
    public void onEnabled(Context context) {
        super.onEnabled(context);
    }

    @Override
    public void onReceive(Context context, Intent intent) {
        super.onReceive(context, intent);
    }

    @Override
    public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) {
        for (int i = 0; i < appWidgetIds.length; ++i) {
            RemoteViews remoteViews = new RemoteViews(context.getPackageName(), R.layout.stackwidget);

            // set intent for widget service that will create the views
            Intent serviceIntent = new Intent(context, StackWidgetService.class);
            serviceIntent.putExtra(AppWidgetManager.EXTRA_APPWIDGET_ID, appWidgetIds[i]);
            serviceIntent.setData(Uri.parse(serviceIntent.toUri(Intent.URI_INTENT_SCHEME))); // embed extras so they don't get ignored
            remoteViews.setRemoteAdapter(appWidgetIds[i], R.id.stackWidgetView, serviceIntent);
            remoteViews.setEmptyView(R.id.stackWidgetView, R.id.stackWidgetEmptyView);
            
            // set intent for item click (opens main activity)
            Intent viewIntent = new Intent(context, HoneybuzzListActivity.class);
            viewIntent.setAction(HoneybuzzListActivity.ACTION_VIEW);
            viewIntent.putExtra(AppWidgetManager.EXTRA_APPWIDGET_ID, appWidgetIds[i]);
            viewIntent.setData(Uri.parse(viewIntent.toUri(Intent.URI_INTENT_SCHEME)));
            
            PendingIntent viewPendingIntent = PendingIntent.getActivity(context, 0, viewIntent, 0);
            remoteViews.setPendingIntentTemplate(R.id.stackWidgetView, viewPendingIntent);
            
            // update widget
            appWidgetManager.updateAppWidget(appWidgetIds[i], remoteViews);
        }
        super.onUpdate(context, appWidgetManager, appWidgetIds);
    }
}

No método onUpdate iteramos por todas as instâncias de widgets e adicionamos os Intents para o serviço que vai criar cada vista e também para cada click num item.

Criar o widget service e a vista para cada item

Num widget StackView preciamos de um layout separado para cada item da colecção. Já devem saber como criar um, mas aqui está o que foi utilizado no widget do Honeybuzz:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/stackWidgetItem"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:background="@drawable/stackwidget_border"
    android:padding="4dp">
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:background="@drawable/stackwidget_background">
          <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/stackWidgetItemUser"
            android:orientation="vertical"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:padding="10dp">
             <ImageView android:id="@+id/stackWidgetItemPicture"
                 android:layout_height="100dip"
                 android:layout_width="100dip">
            </ImageView>
            <TextView android:id="@+id/stackWidgetItemUsername"
                android:textSize="10sp"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                 android:paddingTop="6dp">
            </TextView>
           </LinearLayout>
         <TextView android:id="@+id/stackWidgetItemContent"
             android:layout_height="fill_parent"
             android:layout_width="fill_parent"
             android:maxLines="7"
            android:paddingTop="6dp"
            android:paddingBottom="6dp"
            android:paddingRight="6dp"
            android:paddingLeft="0dp">
        </TextView>
    </LinearLayout>
</LinearLayout>

O widget service tem de especificar a fábrica das views, que é responsável por criar a vista para cada item da colecção.

public class StackWidgetService extends RemoteViewsService {
    @Override
    public RemoteViewsFactory onGetViewFactory(Intent intent) {
        return new StackRemoteViewsFactory(this.getApplicationContext(), intent);
    }
}

class StackRemoteViewsFactory implements RemoteViewsService.RemoteViewsFactory {
    private final ImageDownloader imageDownloader = new ImageDownloader();
    private List<Buzz> mBuzzes = new ArrayList<Buzz>();
    private Context mContext;
    private int mAppWidgetId;

    public StackRemoteViewsFactory(Context context, Intent intent) {
        mContext = context;
        mAppWidgetId = intent.getIntExtra(AppWidgetManager.EXTRA_APPWIDGET_ID, AppWidgetManager.INVALID_APPWIDGET_ID);
    }

    public void onCreate() {
    }

    public void onDestroy() {
        mBuzzes.clear();
    }

    public int getCount() {
        return mBuzzes.size();
    }

    public RemoteViews getViewAt(int position) {
        RemoteViews rv = new RemoteViews(mContext.getPackageName(), R.layout.stackwidget_item);
        
        if (position <= getCount()) {
            Buzz buzz = mBuzzes.get(position);
            
            if (buzz.picture != null) {
                try {
                    Bitmap picture = imageDownloader.downloadBitmap(buzz.picture, 100, 100, 70);
                    rv.setImageViewBitmap(R.id.stackWidgetItemPicture, picture);
                }
                catch(Exception e) {
                    Logging.e("Error reading picture file", e);
                }
            }
            
            if (!buzz.username.isEmpty()) {
                rv.setTextViewText(R.id.stackWidgetItemUsername, buzz.username);
            }
            rv.setTextViewText(R.id.stackWidgetItemContent, Html.fromHtml(buzz.content));
            
            // store the buzz ID in the extras so the main activity can use it
            Bundle extras = new Bundle();
            extras.putString(HoneybuzzListActivity.EXTRA_ID, buzz.id);
            Intent fillInIntent = new Intent();
            fillInIntent.putExtras(extras);
            rv.setOnClickFillInIntent(R.id.stackWidgetItem, fillInIntent);
        }
        
        return rv;
    }

    public RemoteViews getLoadingView() {
        return null;
    }

    public int getViewTypeCount() {
        return 1;
    }

    public long getItemId(int position) {
        return position;
    }

    public boolean hasStableIds() {
        return true;
    }

    public void onDataSetChanged() {
        mBuzzes = Buzz.getBuzzes(HoneybuzzApplication.buzz, mContext);
    }
}

As partes mais importantes:

StackWidgetService: escrever o método onGetViewFactory para devolver a fábrica das views.
StackRemoteViewsFactory: gere as views para cada item da colecção.
- onDataSetChanged: carrega a informação necessária para mostrar no widget.
- onDestroy: destruir todos os objectos que já não são necessários.
- getViewAt: tem de devolver uma vista para o item na posição específica. Criamos uma nova vista com o ficheiro de layout especificado anteriormente, depois vamos buscar o objecto Buzz apropriado que usamos para preencher a vista com informação. No final adicionamos o Intent para o click, de forma a que quando o item seja seleccionado, a aplicação Honeybuzz seja aberta com o mesmo.

Como criar uma imagem de amostra para o widget

Uma imagem de amostra é apresentada quando o utilizador está a navegar na galeria dos widgets e ajuda o mesmo a perceber como o widget funciona. Se não for fornecida uma imagem de amostra, será usado o ícone da aplicação no seu lugar.

Felizmente, o emulador e o SDK do Android vêm com uma aplicação para gerar imagens de amostra a partir de widgets. A aplicação chama-se "Widget Preview" e pode ser usada a partir do emulador ou ser copiada para um dispositivo e ser corrida a partir daí. O código da aplicação está na pasta do SDK no caminho android-sdk\samples\android-11\WidgetPreview. É possível abrir o projecto, fazer o build e copiá-lo para um dispositivo. A aplicação é simples de usar e muito útil. Depois de gerar uma imagem, é necessário adicioná-la aos drawables do projecto e especificá-la na informação do widget provider (ver mais a cima para um exemplo).

Mais recursos

Próximo: Publicar no mercado Android

Android 101: Como monetizar uma aplicação Android

dsilva — Fri, 09 Dec 2011 09:35:50 +0000

Anterior: Services, AsyncTasks e Notifications

Há diversas maneiras de ganhar dinheiro através de aplicações. Mais abaixo alguns detalhes sobre cada uma destas estratégias:

Aplicações pagas
Compras dentro da aplicação
Anúncios

A forma que escolhemos para monetizar a nossa aplicação foi através de anúncios e por isso pode encontrar no fim deste artigo instruções de como criar anúncios usando o Google AdMob.

Aplicações pagas

Aplicações pagas são descarregadas menos vezes do que aplicações grátis. No entanto, o lucro que trará é certo para cada download.

Apenas uma versão paga

Poderá ter apenas uma versão paga da sua aplicação. Considere bem todas as implicações de ir por este caminho. O utilizador precisa confiar que a promessa que lhe faz quando descreve a sua aplicação se vai tornar realidade quando a descarregar e utilizar. O utilizador está a dar-lhe dinheiro por algo que possivelmente nunca usou antes. Por isso precisa ganhar a sua confiança. Prepare uma boa campanha de marketing. Tome atenção ao que outros utilizadores dizem nas reviews da aplicação. Faça videos demonstrativos das funcionalidades da aplicação. Um portfólio de aplicações com boas avaliações é uma garantia de boa qualidade das aplicações novas que criar.

Versão Lite

Pode ter uma versão lite gratuita da sua aplicação e uma versão paga com funcionalidades extra. Esta é uma óptima forma de mostrar aos utilizadores o valor da aplicação sem eles terem que gastar dinheiro à partida. O utilizador pode testar a aplicação, as funcionalidades principais, a sensação de usar a aplicação e decidir se quer ou não o pacote completo. Certifique-se que inclui na versão lite as funcionalidades suficientes para que o utilizador possa testar correctamente a aplicação, mas deixe de fora os pormenores que serão indispensáveis ao utilizador se quiser ter um uso perfeito da aplicação.

Sem anúncios

Pode ter uma versão gratuita da aplicação suportada por anúncios e uma outra versão que poderá promover na grátis, sem anúncios.

Tome uma decisão

Estude a hipótese de vender a sua aplicação. As pessoas só gastarão dinheiro por algo que não conseguem encontrar de borla e que lhes traz valor acrescentado. Estude o mercado, que tipo de aplicações existem que fazem algo semelhante a sua? Como são essas aplicações monetizadas?

Compras dentro da aplicação

Com vendas dentro da aplicação poderá rentabilizá-la através da venda de conteúdos ou funcionalidades extra. Por exemplo, dentro de um jogo poderá ter níveis extra disponíveis mediante pagamento.

Freemium

Uma aplicacao freemium é uma aplicação grátis para descarregar, mas depois para poder usar as suas funcionalidades terá que comprar funcionalidades extra dentro da app. Por exemplo, uma aplicação para ler e vender livros onde o lucro viria da venda dos livros.

Os anúncios

Os anúncios são uma importante forma de obter receitas na sua aplicação. Ter anuncios dá-lhe a vantagem de ter uma aplicação gratuita (e logo mais facilmente descarregada do que uma paga) e ainda ser capaz de a rentabilizar. Os anúncios são uma velha forma de monetizar qualquer producto. TV, revistas e websites já o fazem.

Dentro da sua aplicação pode facilmente controlar onde os anúncios são mostrados.

Aprenda o básico

É essencial saber como os anúncios funcionam para que possa optimizar o seu rendimento. Conceitos como custo por click, request vs. impressions, são algo que deve entender para saber como os anúncios geram dinheiro.

Registar os resultados

Você também pode acompanhar o uso da aplicação para optimizar os anúncios que nela coloca. Isso é fácil de se fazer com o Google

Promoção Cruzada

Faça promoção cruzada da sua aplicação. Mostre anúncios dentro de uma das suas aplicações para outra aplicação que tenha criado. Também poderá ter, por exemplo, uma pequena aplicação grátis onde promove outras aplicações pagas criadas por si.

Patrocínio

Também poderá tentar encontrar um patrocinador para a sua aplicação. Por exemplo, se tiver uma aplicação relacionada com fitness, poderá encontrar uma empresa de venda de bebidas energéticas que poderá estar interessada em negociar um patrocínio. Obviamente este não será o meio de rentabilização mais fácil de se atingir, mas pode ser algo que encaixe no perfil da sua aplicação e portanto interessante de se ter em conta.

Instalação de anúncios com AdMob

É muito fácil instalar anúncios numa aplicação usando o AdMob da Google. A Google fornece um conjunto claro e sucinto de instruções sobre como configurar o AdMob.

1. Criar uma conta AdMob ou usar a sua conta Google.

2. Adicionar uma nova aplicação na sua conta AdMob.

Ela vai aparecer em Sites & Apps.

3. Ir a Manage Settings.

Aqui encontrará o Publisher ID que terá de usar mais tarde. Clique em "Get Publisher Code". Aqui é possível obter as bibliotecas de código necessárias para adicionar ao seu projecto.

4. Configurar o código.

Use as instruções da Google para adicionar o código que descarregou ao seu projecto.

Você também vai precisar do Publisher ID que mencionei no passo anterior.

5. Concluído.

Mais recursos

Próximo: Como criar um widget StackView

Android 101: Services, AsyncTasks e Notifications

dsilva — Wed, 07 Dec 2011 11:00:41 +0000

Anterior: Usar fragmentos para lidar com diferentes orientações de ecrã

AsyncTasks

As AsyncTask são semelhantes a threads, no entanto são mais simples de usar, porque não é necessário manipular threads ou handlers. A AsyncTask permite a execução de operações em segundo plano, sem bloquear a thread UI principal, no entanto pode manipular elementos do interface a partir da AsyncTask.

Para implementar uma AsyncTask precisa criar uma subclasse desta e fazer override dos seus métodos, sendo o método de maior relevo o doInBackground(Params. ..). Como o nome deste método indica, ele irá executar um trecho de código em segundo plano.

Na nossa aplicação necessitamos carregar o stream de Buzzes através da rede. A melhor maneira de o fazer é através de uma AsyncTask. Isto libertará a thread principal da aplicação, o que evita o bloqueio da interface do utilizador ou, num caso pior, o sistema lançar um aviso ao utilizador para matar a aplicação porque esta não se encontra a responder. Veja mais detalhes de como desenhar a sua aplicação para dar uma resposta mais imediata.

Um exemplo de como usar a AsyncTask retirado da nossa aplicação:

class LoadBuzzes extends AsyncTask<Void, Void, ArrayList< Buzz>> {
	@Override
	protected void onPreExecute() {
		getHoneybuzzActivity().showProgress(); // show loading screen
	}

	@Override
	protected ArrayList<Buzz> doInBackground(Void... params) {
		try {
			// we’re caching the data so we’ll check if we need to update it from the server or just load from cache
			boolean refresh = Buzz.getUpdateChachedBuzzes(getActivity());
			Buzz.setUpdateChachedBuzzes(getActivity(), false);
			return Buzz.getBuzzes(getBuzz(), getActivity(), refresh);
		}
		catch (Exception e) {
			handleException(e);
			return null;
		}
	}

	@Override
	protected void onPostExecute(ArrayList< Buzz> feed) {
		getHoneybuzzActivity().hideProgress(); // hide loading screen
		if (feed != null) {
			try {
				// load buzzes list onto the UI
			}
			catch(Exception e) {
				Logging.e("Error loading buzzes", e);
			}
		}
	}
}

Esta tarefa é lançada da seguinte forma:

new LoadBuzzes().execute();

Services

Na documentação Android:

Um Service é um componente que representa tanto a intenção de uma aplicação executar uma operação de longa duração enquanto não interage com o utilizador ou fornecer funcionalidades para outras aplicações usarem.

Para verificar se existem actualizações no stream do Buzz usamos um Service que corre em segundo plano. Quando actualizações são encontradas, o Service mostra uma notificação. Estes são os trechos de código mais importantes na nossa classe de sincronização:

private Timer mTimer = new Timer();
private NotificationManager mNM;

@Override
public void onCreate() {
	mNM = (NotificationManager)getSystemService(NOTIFICATION_SERVICE);

	// the time interval between checks is saved in the app’s preferences
	SharedPreferences prefs = HoneybuzzApplication.getSharedPreferences();
	int intervalMinutes = Integer.parseInt(prefs.getString(HoneybuzzApplication.PREFERENCE_INTERVAL, String.valueOf(30)));
	int intervalMiliseconds = intervalMinutes * 60 * 1000;
	mTimer.schedule(mUpdateTask, intervalMiliseconds, intervalMiliseconds);
}

private TimerTask mUpdateTask = new TimerTask() {
	@Override
	public void run() {
		try {
			String lastUpdated = com.quasibit.honeybuzz.Buzz.getLastUpdated(getApplicationContext());
			String serverUpdate = com.quasibit.honeybuzz.Buzz.getServerUpdated(HoneybuzzApplication.buzz, getApplicationContext());

			// check if the last update to the server is the same as the last update available in cache
			if (!lastUpdated.equals(serverUpdate)) {
				Buzz.getBuzzes(HoneybuzzApplication.buzz, getApplicationContext(), true);

				// after the updates are loaded the user gets a notification
				showNotification();
			}
		}
		catch(Exception e) {
			Logging.e(e);
		}
	}
};

Aqui encontram um bom artigo com a comparação entre AsyncTask, Service, Thread, e IntentService.

Notificações

Uma notificação é uma mensagem que aparecerá na barra de status do sistema alertando o utilizador sobre algo que ele deve saber. A sua implementação é muito simples.

No caso da nossa aplicação, notificamos o utilizador sempre que encontrarmos actualizações no seu stream do Buzz. Veja como lançamos a nossa notificação:

private NotificationManager mNM = (NotificationManager)getSystemService(NOTIFICATION_SERVICE);

private void showNotification() {
	String msg = getApplicationContext().getString(R.string.notif_buzzupdates);
	Notification notification = new Notification(R.drawable.ic_launcher_honeybuzz, msg, System.currentTimeMillis());
	PendingIntent contentIntent = PendingIntent.getActivity(this, 0, new Intent(this, HoneybuzzListActivity.class), 0);
	notification.setLatestEventInfo(this, getApplicationContext().getString(R.string.app_name), msg, contentIntent);
	mNM.notify(NOTIFICATION, notification);
}

Opcionalmente pode adicionar à sua notificação uma mensagem, um som de alerta, vibração e/ou piscar de LED.

Próximo: Como monetizar uma aplicação Android

Android 101: Usar fragmentos para lidar com diferentes orientações de ecrã

nunof — Mon, 05 Dec 2011 08:50:37 +0000

Anterior: Estilos e themes

O Honeycomb introduziu o conceito de fragmentos. Os fragmentos são a resposta para lidar com ecrãs de diferentes tamanho, desde telemóveis até tablets, televisões e outros gadgets. Um fragmento representa uma porção de um interface de utilizador. Uma Acitvity pode ter diversos fragmentos e o mesmo fragmento pode ser usado em mais que uma Activity.

Vamos considerar o exemplo comum que demonstra a sua utilidade. Temos um painel esquerdo com uma listagem de itens e um painel direito que mostra os detalhes do item seleccionado. Este layout é usado na aplicação Honeybuzz. Um layout destes podem ser feito com dois fragmentos: um para a listagem dos itens e outro para os detalhes de um item. Dependendo da orientação do dispositivo, ou mostramos os fragmentos lado a lado ou, se o dispositivo estiver em modo portrait, mostramos apenas um dos fragmentos.

Um layout para uma listagem e detalhes, usando fragmentos

São necessárias diversas partes para construir um layout como o usado na aplicação Honeybuzz:

ListActivity: tem um layout diferente conforme a orientação do ecrã:
- layout: layout no modo paisagem. Contém ListFragment e DetailsFragment.
- layout-port: layout no modo portrait. Apenas contém ListFragment.
DetailsActivity: apenas usada no modo portrait. Contém DetailsFragment.
ListFragment: quando um item é seleccionado, dependendo da orientação do ecrã, vai actualizar o DetailsFragment ou então lançar a DetailsActivity.

No fundo temos duas estratégias diferentes e vamos usá-las conforme a orientação do ecrã.

Criar a ListActivity e o ListFragment

A ListActivity é bastante simples. É uma Activity normal, mas com um layout diferente dependendo da orientação do ecrã. Como expliquei anteriormente, o layout no modo paisagem contém tanto o ListFragment como o DetailsFragment e o layout no modo portrait contém apenas o ListFragment.

O Android é bastante esperto no que toca a escolher o ficheiro de recurso apropriado para um layout. Se o dispositivo estiver no modo paisagem, o Android vai primeiro procurar na pasta layout-land pelo ficheiro de recurso. Se não estiver disponível, só então irá tentar encontrá-lo na pasta layout. De igual forma para o modo portrait, mas procurando antes na pasta layout-port. Basicamente criam-se dois ficheiros de layout separados com o mesmo nome, colocando-os nas pastas apropriadas e o Android vai carregá-los apropriadamente de acordo com a orientação do ecrã.

O ficheiro de layout no modo paisagem é o seguinte:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="fill_parent">
    <fragment class="com.quasibit.honeybuzz.HoneybuzzListFragment"
            android:id="@+id/listFragment"
            android:layout_weight="1"
            android:layout_width="@dimen/list_item_size"
            android:layout_height="fill_parent" />
    <fragment class="com.quasibit.honeybuzz.HoneybuzzDetailsFragment"
            android:id="@+id/details"
            android:layout_weight="2"
            android:layout_width="match_parent"
            android:layout_height="fill_parent"
            android:background="?android:attr/detailsElementBackground" />
</LinearLayout>

E no modo portrait:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <fragment class="com.quasibit.honeybuzz.HoneybuzzListFragment"
            android:id="@+id/listFragment"
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
</LinearLayout>

Quanto ao ListFragment, este será o fragmento que irá mostrar a listagem dos itens. Pode-se usar um ficheiro de layout normal. O nosso layout só tem um LinearLayout, uma ListView e um TextView:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/listLayout"
      android:orientation="vertical" 
      android:layout_width="fill_parent"
      android:layout_height="wrap_content">
    <ListView
        android:id="@+id/listBuzzes" 
        android:drawSelectorOnTop="false" 
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />
    <TextView android:id="@android:id/empty"
               android:layout_height="fill_parent"
               android:text="@string/no_activities"
               android:layout_width="wrap_content"
               android:layout_gravity="left"
               android:layout_marginLeft="10dp"
               android:layout_marginTop="10dp" />
</LinearLayout>

A parte importante é a classe do fragmento. Fica aqui um excerto com as partes mais importantes:

public class HoneybuzzListFragment extends HoneybuzzFragment implements OnItemClickListener {
    protected String mCurrentId;
    protected ListView mListView;
    protected ArrayList<com.quasibit.honeybuzz.Buzz> mBuzzes;
    protected Boolean mDualPane;

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.list_fragment, container, false);
        
        return view;
    }
        
    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        
        // set list view properties
        this.mListView = (ListView) getActivity().findViewById(R.id.listBuzzes);
        
        if (this.mListView != null) {
            this.mListView.setOnItemClickListener(this);
            this.mListView.setChoiceMode(ListView.CHOICE_MODE_SINGLE);
        }

        // check if we are in dual pane mode
        HoneybuzzDetailsFragment details = (HoneybuzzDetailsFragment) getFragmentManager().findFragmentById(R.id.details);
        mDualPane = !(details == null || !details.isInLayout());
        
        // get current id from saved state or extras
        if (savedInstanceState != null) {
            // Restore last state for checked position.
            mCurrentId = savedInstanceState.getString(HoneybuzzListActivity.EXTRA_ID);
        }
        
        if (this.getActivity().getIntent() != null) {
            String id = this.getActivity().getIntent().getStringExtra(HoneybuzzListActivity.EXTRA_ID);
            
            if (id != null && !id.isEmpty()) {
                mCurrentId = id;
            }
        }
    }

    @Override
    public void onSaveInstanceState(Bundle outState) {
        super.onSaveInstanceState(outState);
        outState.putString(HoneybuzzListActivity.EXTRA_ID, mCurrentId);
    }

    @Override
    public void onItemClick(AdapterView<?> l, View v, int position, long id) {
        if (position < mBuzzes.size()) {
            // get matching buzz id from position
            String buzzId = mBuzzes.get(position).id;
            showDetails(buzzId);
        }
    }

    public void showDetails(String id) {
        if (id != null && !id.isEmpty() && mBuzzes != null && !mBuzzes.isEmpty()) {
 // find buzz object
            com.quasibit.honeybuzz.Buzz buzz = getBuzz(id);
            
            if (buzz != null) {
                mCurrentId = id;
                
                // highlight selected item
                int index = mBuzzes.indexOf(buzz);
                
                if (index >= 0) {
                    mListView.setItemChecked(index, true);
                }
        
                // load item
                if (mDualPane) {
                    HoneybuzzDetailsFragment details = (HoneybuzzDetailsFragment) getFragmentManager().findFragmentById(R.id.details);
                    details.load(buzz);
                } else {
                    // launch new activity because we're in single mode pane
                    Intent showContent = new Intent(getActivity(), HoneybuzzDetailsActivity.class);
                    showContent.putExtra(HoneybuzzDetailsActivity.EXTRA_BUZZ, buzz);
                    startActivity(showContent);
                }
            }
        }
    }
}

Algumas notas:

A classe descende de HoneybuzzFragment, que é um fragmento com código Google Analytics e com outros métodos úteis.
onCreateView: usado para especificar o ficheiro de layout.
onActivityCreated: determina se o ecrã está em modo duplo e regista isso na variável mDualPane. Tentamos ler o ID actual tanto da instância gravada (quando a Activity está a ser recuperada) como da informação dos extras (quando outra parte da aplicação pede para ver os detalhes de um ID particular).
onSaveInstanceState: o ID actual é gravado antes da Activity ir para estado de background. Este ID é recuperado quando a Activity é recriada.
showDetails: carrega o objecto Buzz com a ID dada. O importante é o modo como os detalhes são mostrados. Se estivermos em modo duplo, vamos buscar o HoneybuzzDetailsFragment e passamos o objecto Buzz. De outra forma, lançamos a HoneybuzzDetailsActivity e passamos o objecto Buzz.

Construir o DetailsFragment e a DetailsActivity

A DetailsActivity só é usada em modo portrait. Neste modo precisamos de uma ListActivity e de uma DetailsActivity, porque temos dois ecrãs diferentes e só um é mostrado de cada vez.

A DetailsActivity é bastante simples, apenas reusamos o DetailsFragment (que também é usado na ListActivity):

public class HoneybuzzDetailsActivity extends HoneybuzzActivity {
    public static final String EXTRA_BUZZ = "com.quasibit.honeybuzz.HoneybuzzListActivity.EXTRA_BUZZ";

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        if (getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE) {
            // If the screen is now in landscape mode, we can show the
            // dialog in-line with the list so we don't need this activity.
            finish();
            return;
        }

        if (savedInstanceState == null) {
            // During initial setup, plug in the details fragment.
            HoneybuzzDetailsFragment details = new HoneybuzzDetailsFragment();
            details.setArguments(getIntent().getExtras());
            getFragmentManager().beginTransaction().add(android.R.id.content, details).commit();
        }
    }
}

O DetailsFragment tem um método load que preenche o layout com a informação do objecto Buzz.

public class HoneybuzzDetailsFragment extends HoneybuzzFragment implements OnClickListener {
    protected com.quasibit.honeybuzz.Buzz mBuzz;
    
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.details, container, false);
        
        return view;
    }
        
    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        
        if (savedInstanceState != null) {
            // Restore last state for checked position.
            mBuzz = (Buzz) savedInstanceState.getSerializable(HoneybuzzDetailsActivity.EXTRA_BUZZ);
        }
        
        if (this.getActivity().getIntent() != null) {
            com.quasibit.honeybuzz.Buzz buzz = (Buzz) this.getActivity().getIntent().getSerializableExtra(HoneybuzzDetailsActivity.EXTRA_BUZZ);
            
            if (buzz != null) {
                mBuzz = buzz;
            }
        }
        
        if (mBuzz != null) {
            load(mBuzz);
        }
    }

    @Override
    public void onSaveInstanceState(Bundle outState) {
        super.onSaveInstanceState(outState);
        outState.putSerializable(HoneybuzzDetailsActivity.EXTRA_BUZZ, mBuzz);
    }
    
    public void load(com.quasibit.honeybuzz.Buzz buzz) {
        mBuzz = buzz;
        
        if (buzz != null) {
            // load views with Buzz object data
        }
    }
}

Em onActivityCreated tentamos encontrar o objecto Buzz a mostrar, tanto um gravado antes da Activity ir para o background, como um passado nos extras (chamado a partir de outra parte da aplicação).

More resources

Próximo: Services, AsyncTasks e Notifications

Android 101: Estilos e Temas

dsilva — Wed, 30 Nov 2011 09:15:55 +0000

Anterior: Como criar um menu de opções e adicioná-lo à Action Bar

O que são estilos e themes em Android? Na documentação para programadores ficamos a saber que:

"Um estilo é um conjunto de propriedades que especificam a aparência e formato de uma View ou janela. Um estilo pode especificar propriedades, tais como altura, cor da fonte, preenchimento, tamanho da fonte, cor de fundo e muito mais. Um estilo é definido num recurso XML que é independente do XML que especifica o layout.”

"Um theme é um estilo aplicado a uma Activity ou aplicação inteira, ao invés de uma View individual. Quando um estilo é aplicado como um theme, todas as Views na Activity ou aplicação irão usar todas as propriedades de estilo por ele definidas.”

Resumindo, um estilo é um conjunto de propriedades que definem a aparência de uma View ou janela. Um theme é um tipo específico de estilo que tem alcance sobre a Activity ou toda a aplicação.

Declarar e aplicar um estilo

Vamos ver como declarar um estilo. Adicionar ao ficheiro res/values/styles.xml (se ainda não existir, crie-o).

<resources>
	<style name="AppTheme.Button" parent="@android:style/Widget.Button">
		<item name="android:textSize">12sp</item>
		<item name="android:paddingLeft">10dp</item>
		<item name="android:paddingRight">10dp</item>
	</style>
</resources>

Este estilo tem como atributo pai o widget Button, o que significa que este estilo herdará todas as definições de estilo que um botão padrão tem. Ou seja, se não declaramos nenhuma regra no nosso estilo, os botões que usarem este estilo serão exactamente iguais aos botões padrão, mas neste caso substituímos as propriedades de tamanho do texto e do padding.

<Button
	style="@style/AppTheme.Button"
	android:text="@string/buttontext" />

O que fizemos aqui for criar um botão especifico na nossa aplicação com um estilo personalizado. Algo mais interessante do que isto seria alterar todos os botões na nossa aplicação da mesma forma. Para isso não é necessário alterar todas as definições de todos os botões, basta usar um theme.

Declarar e aplicar um theme

Eis como declarar um theme:

<style name="AppTheme.Light" parent="@android:style/Theme.Holo.Light">
	<item name="android:textSize">14sp</item>
	<item name="android:buttonStyle">@style/AppTheme.Button</item>
	<item name="android:editTextStyle">@style/AppTheme.EditText</item>
	<item name="listItemStyle">@style/AppTheme.ListItemStyle</item>
</style>

Praticamente o mesmo que a declaração de um estilo, mas note a diferença no atributo parent do estilo. O parent é um theme out-of-the-box do Android. Algo que pode notar na segunda propriedade do theme é que estamos a associar a todos os botões da aplicação um estilo (android:buttonStyle). Como pode ver, fazemos referência ao estilo criado anteriormente.

Agora este theme pode ser aplicado a uma Activity ou a toda a aplicação. Necessita editar o ficheiro AndroidManifest.xml.

<application android:theme="@style/AppTheme.Light">
<activity android:theme="@style/AppTheme.Light ">

Use um ou outro, dependendo do alcance necessário.

Herança em estilos

Na nossa aplicação criamos dois temas, um com tons claros (Light) e um mais escuro (Dark).

(Light)

(Dark)

Portanto tivemos que criar duas definições de themes.

<style name="AppTheme.Light" parent="@android:style/Theme.Holo.Light">
	<item name="android:textSize">14sp</item>
	<item name="android:buttonStyle">@style/AppTheme.Button</item>
	<item name="android:editTextStyle">@style/AppTheme.EditText</item>
	<item name="listItemStyle">@style/AppTheme.ListItemStyle</item>
</style>

<style name="AppTheme.Dark" parent="@android:style/Theme.Holo">
	<item name="android:textSize">14sp</item>
	<item name="android:buttonStyle">@style/AppTheme.Button</item>
	<item name="android:editTextStyle">@style/AppTheme.EditText</item>
	<item name="listItemStyle">@style/AppTheme.ListItemStyle.Dark</item>
</style>

Além do atributo parent há outra forma de declarar herança através da nomenclatura dos estilos. Por exemplo, para a declaração dos widgets no tema Dark, podemos herdar todas as definições a partir da definição do tema Light e só substituir o que precisamos:

<style name="AppTheme.ListItemStyle.Dark">
	<item name="android:background">@color/list_item_dark</item>
</style>

AppTheme.ListItemStyle.Dark é interpretado como uma herança do estilo já definido AppTheme.ListItemStyle. Esta é uma forma mais estruturada e legível de declarar relações de parentesco, especialmente se tivermos vários temas ou estilos para widgets.

Veja todos os widgets disponíveis para substituição aqui.

Criar um estilo personalizado para uma vista

Uma das propriedades na definição do theme que mostrei é listItemStyle.

<style name="AppTheme.Light" parent="@android:style/Theme.Holo.Light">
	<item name="android:textSize">14sp</item>
	<item name="listItemStyle">@style/AppTheme.ListItemStyle</item>
</style>

<style name="AppTheme.ListItemStyle">
	<item name="android:background">@color/list_item</item>
</style>

Tive a necessidade de criar este valor personalizado porque queria criar um estilo para um LinearLayout, que seria diferente dependendo do theme activo. Essa opção não existe no namespace android (como o android:textSize, por exemplo).

Esta é a minha definição da vista:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:id="@+id/feedListItem"
	android:layout_height="wrap_content"
	android:layout_width="fill_parent"
	style="?listItemStyle">
	<ImageView android:id="@+id/picture"
		android:layout_height="100dip"
		android:layout_width="100dip"/>
	<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
		android:id="@+id/user"
		android:orientation="vertical"
		android:layout_height="wrap_content"
		android:layout_width="fill_parent"
		android:padding="10dp">
		<TextView android:id="@+id/textUsername"
			android:textAppearance="?android:attr/textAppearanceSmall"
			android:layout_height="wrap_content"
			android:layout_width="fill_parent"
			android:layout_gravity="center_horizontal"
			android:textStyle="bold"/>
		<TextView android:id="@+id/textContent"
			android:layout_height="fill_parent"
			android:layout_width="fill_parent"
			android:paddingTop="6dp"
			android:maxLines="3"/>
	</LinearLayout>
</LinearLayout>

Repare no atributo style no LinearLayout raiz.

A última coisa que precisamos fazer para que isso funcione é declarar o novo atributo. Caso contrário, terá um erro que diz que o atributo não existe:

No ficheiro res/values/attrs.xml crie uma nova declaração:

<?xml version="1.0" encoding="utf-8"?>

<?xml version="1.0" encoding="utf-8"?>

Mudar o estilo ou theme em tempo de execução

Como tínhamos dois themes diferentes queríamos permitir que o utilizador alterasse o theme activo através das preferências.

Guardamos a preferência selecionada nas SharedPreferences da aplicação e carregamo-la no método onCreate da Activity.

public void onCreate(Bundle savedInstanceState) {
	super.onCreate(savedInstanceState);
	SharedPreferences prefs = HoneybuzzApplication.getSharedPreferences();
	String themeName = prefs.getString(HoneybuzzApplication.PREFERENCE_THEME, "AppTheme.Light");
	int themeId = getResources().getIdentifier(themeName, "style", getPackageName());
	setTheme(themeId);
}

Terá que fazer isto para todas as Activities na sua aplicação ou, como nos fizemos, criar uma classe Activity que trata de todas as personalizações e da qual todas as Activities vão herdar.

Também é necessário recarregar o theme de cada vez que o utilizador alterar as preferências da aplicação. Fazêmo-lo na nossa Activity da qual as outras vão herdar.

// handle updates to preferences
public void onSharedPreferenceChanged(SharedPreferences prefs, String key) {
	if (key.equals(HoneybuzzApplication.PREFERENCE_THEME)) {
		// recreate activity so theme gets updated
		this.recreate();
	}
}

Mais recursos

Próximo: Usar fragmentos para lidar com diferentes orientações de ecrã

Android 101: Como criar um menu de opções e adicioná-lo à Action Bar

nunof — Mon, 28 Nov 2011 07:55:43 +0000

Anterior: Guardar e ler as preferências do utilizador

Um menu é útil para disponibilizar acesso a diferentes partes de uma aplicação. É fácil adicionar um menu a uma aplicação Android.

Criar um ficheiro de recurso para o menu

O primeiro passo é criar uma pasta menu na pasta res da aplicação.

Depois é necessário adicionar um ficheiro XML.

Definem-se as opções individuais usando o elemento item. Especificam-se os atributos id, icon e title para cada opção. Eis o ficheiro do menu da aplicação Honeybuzz:

<?xml version="1.0" encoding="utf-8"?>
<menu
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@+id/menuRefresh"
          android:icon="@android:drawable/ic_popup_sync"
          android:title="@string/menu_refresh"
          android:alphabeticShortcut="r"
          android:showAsAction="always" />
    <item android:id="@+id/menuProgress"
          android:actionLayout="@layout/progress"
          android:showAsAction="always" />
    <item android:id="@+id/menuNewBuzz"
          android:icon="@android:drawable/ic_input_add"
          android:title="@string/menu_new_buzz"
          android:alphabeticShortcut="n"
          android:showAsAction="ifRoom|withText" />
    <item android:id="@+id/menuAccounts"
          android:icon="@android:drawable/ic_lock_lock"
          android:title="@string/menu_accounts"
          android:alphabeticShortcut="a"
          android:showAsAction="withText" />
    <item android:id="@+id/menuPreferences"
          android:icon="@android:drawable/ic_menu_preferences"
          android:title="@string/menu_preferences"
          android:alphabeticShortcut="s"
          android:showAsAction="withText" />
    <item android:id="@+id/menuAbout"
          android:icon="@android:drawable/ic_menu_info_details"
          android:title="@string/menu_about"
          android:alphabeticShortcut="b"
          android:showAsAction="withText" />
</menu>

O atributo showAsAction permite especificar quando e como é que cada opção aparece-se na ActionBar (a ActionBar é a barra com o título que aparece no topo de uma aplicação Android a partir da versão Honeycomb). Os valores disponíveis são: ifRoom, withText, never e always.

Construir o menu e gerir as opções

Depois é preciso actualizar a Activity onde o menu vai aparecer. É preciso criar o método onCreateOptionsMenu para construir o menu e também o método onOptionsItemSelected para gerir as opções. Foi assim que o menu da aplicação Honeybuzz foi construído:

@Override
public boolean onCreateOptionsMenu(Menu menu) {
	this.menuHandler = menu;

	MenuInflater inflater = getMenuInflater();
	inflater.inflate(R.menu.menu, menu);
	hideProgress();

	return super.onCreateOptionsMenu(menu);
}

public void showProgress() {
	this.menuHandler.findItem(R.id.menuRefresh).setVisible(false);
	this.menuHandler.findItem(R.id.menuProgress).setVisible(true);
}

public void hideProgress() {
	this.menuHandler.findItem(R.id.menuProgress).setVisible(false);
	this.menuHandler.findItem(R.id.menuRefresh).setVisible(true);
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
	switch (item.getItemId()) {
		case android.R.id.home:
			// go home
			Intent intent = new Intent(this, HoneybuzzListActivity.class);
			intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
			startActivity(intent);
			return true;
		case R.id.menuNewBuzz:
			startActivity(new Intent(this, HoneybuzzAddActivity.class));
			return true;
		case R.id.menuAccounts:
			showDialog(DIALOG_ACCOUNTS);
			return true;
		case R.id.menuPreferences:
			startActivity(new Intent(this, HoneybuzzPreferences.class));
			return true;
		case R.id.menuRefresh:
			// refresh buzzes (handled on child Activity)
			return true;
			case R.id.menuAbout:
			loadAboutDialog(getString(R.string.about_title));
			return true;
	}

	return super.onOptionsItemSelected(item);
}

A Action Bar aparece por padrão no Honeycomb. Fica no topo do ecrã e inclui o ícone da aplicação. O menu vai ser adicionado à Action Bar e, dependendo dos atributos de cada opção, algumas opções irão aparecer como botões só com um ícone, enquanto as restantes estarão disponíveis como texto numa dropdown.

Normalmente quando se selecciona uma opção inicia-se uma Activity. Como a maioria das Activities é descendente da Activity principal, estas vão partilhar o mesmo menu. Os métodos showProgress/hideProgress são usados quando a aplicação está ocupada a processar informação. Existe um botão de refresh que pode ser activado para carregar os dados de novo e, quando a aplicação está a processar os dados, o botão vai ser substituído por um indicador de progresso.

Para gerir o botão home (o botão com o ícone da aplicação que fica no canto superior esquerdo) basta comparar o ID com android.R.id.home.

Como gerar ícones para as opções da Action Bar

Em geral cada opção é acompanhada de um ícone. É necessário fazerem-se diferentes imagens para tamanhos diferentes de ecrãs. O Android Asset Studio é uma ferramenta útil que gera as diferentes imagens. Basta fornecer uma imagem ou escolher uma da galeria e permite também adicionar um texto personalizado. Existem outras opções de configuração (padding, trim, theme) e no final faz-se o download de um arquivo zip com todas as imagens.

O Android Asset Studio também é útil para gerar ícones para outras partes da aplicação (launcher, Action Bar, etc.) e faz parte do android-ui-utils, que também fornece templates Photoshop para os ícones respeitando as directrizes do Android.

Além de poder criar os seus próprios ícones, também pode usar os ícones que vêm com o Android. O Android vem com um conjunto de drawables que podem ser usados em várias situações diferentes. Por exemplo, para o Froyo (Android 2.2) podem ver no Android Drawables explorer o que está disponível. Acedem-se a estes recursos desta forma: android.R.drawable.ic_menu_save.

Para ver que drawables estão disponíveis no Honeycomb (ou noutra versão qualquer), recomendo que adicionem uma ImageView a um ficheiro de layout, usando a vista "Graphical Layout". Depois se escolherem "System Resources" vão ver todas as opções disponíveis assim como uma imagem de amostra.

Mais recursos

Próximo: Estilos e themes

Android 101: Guardar e ler as preferências do utilizador

nunof — Fri, 25 Nov 2011 07:40:17 +0000

Anterior: Usar Google Analytics numa aplicação Android

Permitir aos utilizadores configurar a aplicação ao seu gosto é uma das funcionalidades básicas de uma aplicação. Neste artigo vou descrever como construir um ecrã de preferências para uma aplicação Android e como guardar e ler as preferências do utilizador.

Como criar um ecrã de preferências no Android

Um ecrã de preferências cria-se da seguinte forma:

Criar uma pasta xml na pasta res.
Criar um ficheiro preferences.xml (especificar que é um recurso do tipo Preference).

O elemento raiz das preferências deve ser um PreferenceScreen. Agora é necessário adicionar as diferentes opções.

Usa-se uma PreferenceCategory para separar as opções em determinados grupos.
Existem diferentes widgets de preferências como CheckBoxPreference, ListPreference e EditTextPreference, entre outros.

Para cada preferência é necessário especificar uma chave, um título e uma descrição. Também é possível especificar valores padrão, opções de persistência e outras propriedades específicas a cada widget.

Eis um exemplo de um ficheiro de preferências da aplicação Honeybuzz:

<?xml version="1.0" encoding="utf-8"?>
<PreferenceScreen
  xmlns:android="http://schemas.android.com/apk/res/android">
    <PreferenceCategory android:title="@string/pref_category_design">
        <ListPreference
            android:title="@string/pref_theme_title"
            android:summary="@string/pref_theme_summary"
            android:key="honeybuzz.theme"
            android:persistent="true"
            android:defaultValue="AppTheme.Light"
            android:entries="@array/themeNames"
            android:entryValues="@array/themeValues" />
    </PreferenceCategory>
    <PreferenceCategory android:title="@string/pref_category_service">
        <ListPreference
            android:title="@string/pref_interval_title"
            android:summary="@string/pref_interval_summary"
            android:key="honeybuzz.interval"
            android:persistent="true"
            android:defaultValue="30"
            android:entries="@array/intervalNames"
            android:entryValues="@array/intervalValues" />
    </PreferenceCategory>
    <PreferenceCategory android:title="@string/pref_category_error">
        <CheckBoxPreference android:key="acra.enable"
            android:persistent="true"
            android:title="@string/pref_disable_acra"
            android:summaryOn="@string/pref_acra_enabled"
            android:summaryOff="@string/pref_acra_disabled"
            android:defaultValue="true"/>
        <CheckBoxPreference android:key="acra.syslog.enable"
            android:persistent="true"
            android:title="@string/pref_acra_syslog"
            android:summaryOn="@string/pref_acra_syslog_enabled"
            android:summaryOff="@string/pref_acra_syslog_disabled"
            android:defaultValue="true"/>
        <CheckBoxPreference android:key="acra.alwaysaccept"
            android:persistent="true"
            android:title="@string/pref_acra_alwaysaccept"
            android:summaryOn="@string/pref_acra_alwaysaccept_enabled"
            android:summaryOff="@string/pref_acra_alwaysaccept_disabled"
            android:defaultValue="false"/>
    </PreferenceCategory>
</PreferenceScreen>

Nota: A ListPreferences só funciona com vectores de strings. Não é possível usar vectores de inteiros (ou de outro tipo qualquer) com a ListPreferences, caso contrário será gerado um erro.

Criar uma Activity para as preferências

Agora que as preferências foram definidas, é necessário criar uma Activy para as mostrar, devendo ser uma sub-classe da PreferenceActivity e adicionar as preferências partir de um ficheiro de recurso.

package com.quasibit.honeybuzz;

import android.os.Bundle;
import android.preference.PreferenceActivity;
import android.preference.PreferenceManager;

public class HoneybuzzPreferences extends PreferenceActivity {
      @Override 
      public void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 

        PreferenceManager prefMgr = getPreferenceManager();
        prefMgr.setSharedPreferencesName(HoneybuzzApplication.PREFERENCES_NAME);
        prefMgr.setSharedPreferencesMode(HoneybuzzApplication.PREFERENCES_MODE);
        
        addPreferencesFromResource(R.xml.preferences); 
      }
}

Especificamos também o nome e o modo das preferências.

Na classe principal da aplicação definimos as constantes das preferências e estabelecemos os valores padrão do PreferenceManager.

public class HoneybuzzApplication extends Application {
    public static final String PREFERENCES_NAME = "HoneybuzzPrefs";
    public static final int PREFERENCES_MODE = MODE_PRIVATE;

    public static final String PREFERENCE_THEME = "honeybuzz.theme";
    public static final String PREFERENCE_ISFIRSTUSE = "honeybuzz.firstuse";
    public static final String PREFERENCE_INTERVAL = "honeybuzz.interval";
    
    @Override
    public void onCreate() {
        ...

        PreferenceManager.setDefaultValues(this, PREFERENCES_NAME, PREFERENCES_MODE, R.xml.preferences, false); // set default preferences
        super.onCreate();
    }

    public static SharedPreferences getSharedPreferences() {
        return getInstance().getSharedPreferences(PREFERENCES_NAME, PREFERENCES_MODE);
    }
}

Para iniciar a Activity das preferências adicionamos uma opção ao menu da aplicação e chamamos o ecrã desta forma:

startActivity(new Intent(this, HoneybuzzPreferences.class));

O resultado final é o seguinte:

Como ler as preferências do utilizador

Como adicionamos um método auxiliar à classe principal da aplicação, vamos usá-lo para ir buscar as preferências do utilizador.

Neste exemplo lemos o theme seleccionado pelo utilizador:

SharedPreferences prefs = HoneybuzzApplication.getSharedPreferences();
String themeName = prefs.getString(HoneybuzzApplication.PREFERENCE_THEME, "AppTheme.Light");

Desta forma torna-se fácil ler as preferências do utilizador.

SeekBarPreference

Cedo descobre-se que não há um widget SeekBarPreference^[a]. Este é um tipo comum que é útil em muitas situações diferentes. Uma SeekBarPreference é no fundo um slider, útil para preferências numéricas ou de outros tipos.

Felizmente já várias pessoas passaram por isto e decidiram partilhar os seus widgets.

Encontrei vários exemplos e cada um deles diferente, por isso verifiquem-nos e escolham o mais apropriado:

Mais recursos

Letting your users control ACRA (como permitir ao utilizador configurar o ACRA)
Android Preferences
Steps to Adding Preferences to Your Application

Próximo: Como criar um menu de opções e adicioná-lo à Action Bar

Android 101: Usar Google Analytics numa aplicação Android

nunof — Wed, 23 Nov 2011 10:23:44 +0000

Anterior: Como lidar com erros

Análise e estatísticas ajudam a perceber que partes de uma aplicação são as mais populares ou quais são as mais problemáticas para os utilizadores. O Google Analytics não é só para websites, também pode ser usado em aplicações Android.

Instalar o Google Analytics num projecto Android

Para adicionar o Google Analytics a uma aplicação Android é necessário:

Fazer o download do SDK do Google Analytics para Android.
Adicionar a biblioteca libGoogleAnalytics.jar ao projecto. Para saber como fazer isto vejam o artigo Ambiente de desenvolvimento e criação do projecto (a parte sobre como adicionar bibliotecas externas).
Adicionar as permissões necessárias ao manifesto Android.

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

Ir à conta do Google Analytics e criar um perfil como se fosse para um website. Escolham um URL descritivo (embora não tenha de ser verdadeiro).
É necessário informar os utilizadores, algures na aplicação ou nos termos de serviço, que estes estão a ser monitorizados anonimamente.

Monitorizar as fontes de instalação da aplicação

Uma parte importante da análise de uma aplicação é saber a fonte da instalação da mesma (caso estejam a usar publicidade, por exemplo, ou se têm links de instalação em vários sites).

Para poder saber isso é necessário usar um link no seguinte formato:

http://market.android.com/search?q=pname:<package>&referrer=<referral>
<package> é o nome do package da aplicação.
<referral> é informação específica de uma campanha.
Podem gerar URLs usando a ferramenta Android Market Campaign Tracking.

<application>

    <!-- Used for install referrer tracking (analytics) -->
    <receiver android:name="com.google.android.apps.analytics.AnalyticsReceiver"
              android:exported="true">
      <intent-filter>
        <action android:name="com.android.vending.INSTALL_REFERRER" />
      </intent-filter>
    </receiver>

</application>

Fazer monitorização nas Activities

Pode-se usar o GoogleAnalyticsTracker para monitorizar page views ou eventos numa aplicação. Por exemplo:

GoogleAnalyticsTracker tracker = GoogleAnalyticsTracker.getInstance();
tracker.start(“your analytics tracking ID”, 20, this);
tracker.trackPageView("/welcome");
this.tracker.trackEvent("Category", "Action", "Label", "Value");
tracker.setCustomVar(1, "Name", "Value"); // first parameter is the slot (1 to 5)

Para poupar bateria, esta informação só é enviada passado um intervalo de tempo (20 segundos no exemplo acima), mas também é possível enviar a informação manualmente usando o método tracker.dispatch().

Para tornar esta tarefa mais simples, em vez de adicionar este código manualmente a todas as Activites, criei uma classe a partir da qual todas as Activities são feitas, que não só monitoriza cada Activity, como também tem métodos úteis para fazer a monitorização de eventos e de variáveis personalizadas.

package com.quasibit.honeybuzz;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;

import com.google.android.apps.analytics.GoogleAnalyticsTracker;

public class TrackedActivity extends Activity {
    private static final String TRACKER_ID = "your analytics tracking ID ";
    private static final boolean DISPATCH_MANUAL = false;
    private static final int DISPATCH_INTERVAL = 20;
    private static final boolean DEBUG = false; // If true stores analytics requests in the log cat
    private static final boolean DRY_RUN = false; // If true only stores data locally (doesn't send data to analytics)

    @SuppressWarnings("unused")
    private static final int SCOPE_VISITOR = 1; // Call the first time your application is run on a device. Useful for anything that won't change during the lifetime of the installation of the application (app version, lite vs full, type of phone).
    
    @SuppressWarnings("unused")
    private static final int SCOPE_SESSION = 2; // Call at the beginning of an Activity. Applies to all pageviews and events for the lifecycle of the activity.
    
    @SuppressWarnings("unused")
    private static final int SCOPE_PAGE = 3; // Call before trackEvent or trackPageView that the custom variable should apply to.
    
    @SuppressWarnings("unused")
    private static final int SLOT_1 = 1;
    
    @SuppressWarnings("unused")
    private static final int SLOT_2 = 2;
    
    @SuppressWarnings("unused")
    private static final int SLOT_3 = 3;
    
    @SuppressWarnings("unused")
    private static final int SLOT_4 = 4;
    
    @SuppressWarnings("unused")
    private static final int SLOT_5 = 5;
    
    private GoogleAnalyticsTracker tracker;
    private String pageId;

    @Override
    protected void onCreate(final Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        this.pageId = getClass().getSimpleName();
        this.tracker = GoogleAnalyticsTracker.getInstance();
        
        if (DISPATCH_MANUAL) {
            this.tracker.start(TRACKER_ID, this);
        } else {
            this.tracker.start(TRACKER_ID, DISPATCH_INTERVAL, getApplicationContext());
        }
        this.tracker.setDebug(DEBUG);
        this.tracker.setDryRun(DRY_RUN);
    }

    @Override
    protected void onResume() {
        super.onResume();

        this.tracker.trackPageView("/" + this.pageId);
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        this.tracker.dispatch();
        this.tracker.stop();
    }

    public void dispatch() {
        if (this.tracker != null) {
            this.tracker.dispatch();
        }
    }

    public static void dispatch(final Context baseContext) {
        final GoogleAnalyticsTracker tracker = GoogleAnalyticsTracker.getInstance();
        tracker.start(TRACKER_ID, baseContext);
        tracker.dispatch();
        tracker.stop();
    }

    protected void trackPage(final String page) {
        this.tracker.trackPageView(page);
    }

    protected void trackEvent(final String category, final String action, final String label, final int value) {
        this.tracker.trackEvent(category, action, label, value);
    }

    protected void trackEvent(final String category, final String action, final String label) {
        trackEvent(category, action, label, 0);
    }

    protected void trackEvent(final String action, final String label, final int value) {
        this.tracker.trackEvent(this.pageId, action, label, value);
    }

    protected void trackEvent(final String action, final String label) {
        trackEvent(this.pageId, action, label, 0);
    }

    protected void setCustomVar(final int slot, final String name, final String value, final int scope) {
        this.tracker.setCustomVar(slot, name, value, scope);
    }

    protected void setCustomVar(final int slot, final String name, final String value) {
        this.tracker.setCustomVar(slot, name, value);
    }
}

Como vamos usar fragmentos, a classe TrackedFragment também foi construída.

package com.quasibit.honeybuzz;

import com.google.android.apps.analytics.GoogleAnalyticsTracker;

import android.app.Fragment;
import android.os.Bundle;

public class TrackedFragment extends Fragment {
    private GoogleAnalyticsTracker tracker;
    private String activityId;
    private String fragmentId;

    @Override
    public void onCreate(final Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        this.tracker = GoogleAnalyticsTracker.getInstance();
        this.fragmentId = getClass().getSimpleName();
        this.activityId = getActivity().getClass().getSimpleName();
    }
    
    @Override
    public void onResume() {
        super.onResume();
        this.tracker.trackPageView("/" + this.activityId + "/" + this.fragmentId);
    }
}

Para mais informação sobre como usar o Google Analytics no Android vejam a sessão da Google I/O Optimizing Android Apps with Google Analytics. Outro bom recurso é o artigo Analytics for Android Apps que foi publicado no blog Android Developer.

Próximo: Guardar e ler as preferências do utilizador

Android 101: Como lidar com erros

nunof — Mon, 21 Nov 2011 08:15:54 +0000

Anterior: Trabalhar com a API Google Buzz

O registo de erros e a forma como se lidam com estes é um aspecto importante duma aplicação, não só porque permite descobrir as áreas mais problemáticas de uma aplicação, mas também para fornecer uma boa experiência ao utilizador quando um erro ocorre.

Uma biblioteca popular para lidar com erros em Android é o ACRA. O ACRA fornece relatórios detalhados com informação de cada erro e guarda a informação num formulário Google Doc (ou envia a informação para um script custom ou até para um email - mas um Google Doc é prático e fácil de configurar).

Além disso, o ACRA é personalizável na forma como os erros são apresentados ao utilizador: tanto pode enviar erros silenciosamente sem chamar a atenção, como também é possível mostrar uma caixa de diálogo ao utilizador em que este tem de aceitar voluntariamente o envio do erro e pode ainda deixar uma descrição.

A partir do Froyo, os relatórios de crash são enviados para o programador através do Android Market (se o utilizador aceitar enviá-los), mas o ACRA é mais personalizável e fornece relatórios detalhados.

Configurar uma Google Spreadsheet para relatórios do ACRA

Podem ler um guia de instalação do ACRA no site do projecto. Vou descrever brevemente o procedimento.

Fazer download da última versão a partir do site do ACRA.
Vão ao Google Docs e importem o template CrashReports-template.csv. Certifiquem-se que a conversão está activa.
Abram o novo documento e vão a Tools > Form > Create a form.
Copiem o valor formKey que está visível na parte de baixo da janela.
Escrevam algo na descrição para poderem gravar o formulário.
Se quiserem receber notificações de cada vez que um relatório é gerado (ou diariamente por exemplo), podem editar as regras de notificação.
- No interface antigo do Google Docs expandam o Share e a opção aparece.
- No novo interface do Google Docs têm de ir a Tools > Notification rules...
Para lerem as mensagens de erro com mais facilidade devem redimensionar as colunas e mudar o alinhamento desta forma:

Adicionar o ACRA ao vosso projecto

Adicionem a biblioteca ACRA ao vosso projecto. Sigam as instruções fornecidas no artigo Android 101: Ambiente de desenvolvimento e criação do projecto (ver a parte de como adicionar bibliotecas externas ao projecto).

Na configuração mais básica, só é necessário adicionar um atributo à classe Application com a chave do formulário da vossa Google Spreadsheet. Para esta aplicação, fomos um pouco mais longe e adicionamos as seguintes opções:

@ReportsCrashes(formKey="your form key",
                mode = ReportingInteractionMode.NOTIFICATION,
                resToastText = R.string.crash_toast_text, // optional, displayed as soon as the crash occurs, before collecting data which can take a few seconds
                resNotifTickerText = R.string.crash_notif_ticker_text,
                resNotifTitle = R.string.crash_notif_title,
                resNotifText = R.string.crash_notif_text,
                resNotifIcon = android.R.drawable.stat_notify_error, // optional. default is a warning sign
                resDialogText = R.string.crash_dialog_text,
                resDialogIcon = android.R.drawable.ic_dialog_info, //optional. default is a warning sign
                resDialogTitle = R.string.crash_dialog_title, // optional. default is your application name
                resDialogCommentPrompt = R.string.crash_dialog_comment_prompt, // optional. when defined, adds a user text field input with this text resource as a label
                resDialogOkToast = R.string.crash_dialog_ok_toast, // optional. displays a Toast message when the user accepts to send a report.
                sharedPreferencesName = HoneybuzzApplication.PREFERENCES_NAME, // Name of the SharedPreferences that will host the acra.enable or acra.disable preference.
                sharedPreferencesMode = HoneybuzzApplication.PREFERENCES_MODE // The mode that you need for the SharedPreference file creation: Context.MODE_PRIVATE, Context.MODE_WORLD_READABLE or Context.MODE_WORLD_WRITEABLE.
                )
public class HoneybuzzApplication extends Application {
    public static final String PREFERENCES_NAME = "HoneybuzzPrefs";
    public static final int PREFERENCES_MODE = MODE_PRIVATE;

    @Override
    public void onCreate() {
        ACRA.init(this); // error reporting
        Logging.setLoggingLevel(); // logging level
        PreferenceManager.setDefaultValues(this, PREFERENCES_NAME, PREFERENCES_MODE, R.xml.preferences, false); // set default preferences
        super.onCreate();
    }
}

Especificamos o modo de interacção dos erros, umas mensagens e ícones personalizados e o nome das preferências para que estas possam ser gravas pelos utilizadores.

Existem três tipos de interação:

SILENT: os erros são enviados sem notificar os utilizadores e é mostrado o ecrã padrão do Android (a partir do Froyo).
TOAST: é mostrada ao utilizador uma simples mensagem durante alguns segundos, avisando que foi enviado um relatório de erros, sem que esta tenha que dar qualquer tipo de confirmação.
NOTIFICATION: uma notificação é mostrada ao utilizador que este tem que aceitar para que o relatório de erros seja enviado, com a possibilidade de deixar informação adicional.

Outra funcionalidade interessante é que os utilizadores podem especificar nas preferências da aplicação como querem que seja feita a interacção dos erros.

Classe de Logging

Acabamos por criar uma classe à medida, semelhante à classe android.utils.Log, para agregar toda a funcionalidade de logging: não apenas para escrever relatórios ACRA, mas também para escrever para os logs do Android (que podem ser lidos atráves do LogCat). Esta classe é usada ao longo da aplicação para gravar mensagens, assim como excepções e erros.

Dependendo do nível de logging configurado, os relatórios seriam enviados para o ACRA.

package com.quasibit.honeybuzz;

import java.util.logging.Level;
import java.util.logging.Logger;

import org.acra.ErrorReporter;

import android.util.Log;

public class Logging {
    private static Level LOGGING_LEVEL = Level.ALL;
    private static final String TAG = "Honeybuzz";
    
    public static void setLoggingLevel() {
        Logger.getLogger("com.google.api.client").setLevel(LOGGING_LEVEL);
    }
    
    public static int e(String tag, String msg, Throwable tr) {
        acraReport(Level.SEVERE, tag, msg, tr);
        
        return Log.e(tag, msg, tr);
    }
    
    public static int e(String msg, Throwable tr) {
        return e(TAG, msg, tr);
    }
    
    public static int e(Throwable tr) {
        return e(TAG, tr.getMessage(), tr);
    }
    
    public static int w(String tag, String msg, Throwable tr) {
        acraReport(Level.WARNING, tag, msg, tr);
        
        return Log.w(tag, msg, tr);
    }
    
    public static int w(String msg, Throwable tr) {
        return w(TAG, msg, tr);
    }
    
    public static int w(String tag, String msg) {
        acraReport(Level.WARNING, tag, msg);
        
        return Log.w(tag, msg);
    }
    
    public static int w(String msg) {
        return w(TAG, msg);
    }
    
    public static int i(String tag, String msg, Throwable tr) {
        acraReport(Level.INFO, tag, msg, tr);
        
        return Log.i(tag, msg, tr);
    }
    
    public static int i(String msg, Throwable tr) {
        return i(TAG, msg, tr);
    }
    
    public static int i(String tag, String msg) {
        acraReport(Level.INFO, tag, msg);
        
        return Log.i(tag, msg);
    }
    
    public static int i(String msg) {
        return i(TAG, msg);
    }
    
    public static int d(String tag, String msg) {
        acraReport(Level.FINEST, tag, msg);
        
        return Log.d(tag, msg);
    }
    
    public static int d(String msg) {
        return d(TAG, msg);
    }

    public static int v(String tag, String msg, Throwable tr) {
        acraReport(Level.FINE, tag, msg, tr);
        
        return Log.v(tag, msg, tr);
    }
    
    public static int v(String msg, Throwable tr) {
        return v(TAG, msg, tr);
    }
    
    public static int v(String tag, String msg) {
        acraReport(Level.FINE, tag, msg);
        
        return Log.v(tag, msg);
    }
    
    public static int v(String msg) {
        return v(TAG, msg);
    }

    private static void acraReport(Level level, String tag, String msg, Throwable tr) {
        if (level.intValue() >= LOGGING_LEVEL.intValue()) {
            acraReport(level, tag, msg);
            // report exception to acra silently
            ErrorReporter.getInstance().handleSilentException(tr);
        }
    }
    
    private static void acraReport(Level level, String tag, String msg) {
        if (level.intValue() >= LOGGING_LEVEL.intValue()) {
            ErrorReporter.getInstance().putCustomData(level.getName() + ": " + tag, msg);
        }
    }
}

Análise de relatórios ACRA

O Google Spreadsheets não fornece propriamente uma experiência agradável para a leitura de relatórios de erros. Existem aplicações que foram feitas para lidar com os relatórios criados pelo ACRA. Podem ver alguns exemplos na página de contribuições no site do ACRA.

O BugSense, por exemplo, funciona bem com o ACRA. Ainda não o testei, mas parece ter um bom conjunto de funcionalidades e apenas requer uma configuração mínima.

Próximo: Usar Google Analytics numa aplicação Android

Android 101: Trabalhar com a API Google Buzz

dsilva — Wed, 16 Nov 2011 09:15:35 +0000

Anterior: Ambiente de desenvolvimento e criação do projecto

APIs Google

A Google Buzz API faz parte da mais recente família das Google APIs. Esta família é baseada numa nova infra-estrutura de API (mais sobre isso na apresentação do Google IO: How Google builds APIs . Por cima desta nova infra-estrutura a Google criou uma série de ferramentas que ajudam os programadores a criar aplicações.

Em Outubro de 2011, a Google anunciou que iria descontinuar o Google Buzz e a sua API.

HTTP Transport

Em Android existem algumas opções para fazer o transporte HTTP de mensagens de e para os serviços da Google (neste caso estamos a usar o serviço do Buzz).

UrlFetchTransport - Apenas em Google App Engine.
NetHttpTransport - Incluído no Java e no Android SDK. Escolha preferencial em Android a partir da versão Gingerbread.
ApacheTransport - Incluído no Android SDK. Escolha preferencial para versões antigas do Android SDK (até à versão Froyo).
AndroidHttp.newCompatibleTransport() - Escolhe entre NetHttpTransport ou ApacheTransport dependendo da versão do SDK disponível.

As conexões HTTP não devem ser efectuadas no thread principal do UI, pois não é aconcelhável bloquear o interface por um intervalo indeterminado de tempo enquanto a aplicação comunica com um serviço online. (link para artigo AsyncTask).

JSON

O JSON é um grande foco nas novas APIs da Google. Deve usá-lo como parser/serializer para evitar erros de falta de memória, que acontecem quando tentamos carregar uma resposta JSON como um objecto. Existem algumas opções para o JSON parser/serializer que pode usar.

JacksonFactory - O mais rápido. Baseado na biblioteca Jackson .
GsonFactory - Rápido. Baseado na biblioteca Google GSON .
AndroidJsonFactory - O mesmo que GSON e disponível na versão 3.0 do SDK .

Autenticação

O gerenciamento de autenticação no Android deve ser feito preferencialmente através do uso da classe AccountManager . O AccountManager fornece um registo centralizado de contas de utilizador online. As APIs da Google fornecem uma forma mais específica para lidar com contas Google através da classe GoogleAccountManager .

OAuth

Embora ainda não se encontre na sua versão final, o uso de OAuth 2.0 é recomendado por causa dos benefícios que traz em comparação com a sua versão anterior.

Suportados por (quase) todas as APIs da Google.
Controlo mais refinado dos níveis de acesso.
Exemplo com o Google Buzz
- https://www.googleapis.com/auth/buzz para acesso de leitura/escrita de dados no Buzz.
- https://www.googleapis.com/auth/buzz.readonly para acesso de leitura de dados do Buzz.
- https://www.googleapis.com/auth/photos para acesso de leitura a fotos do Buzz.

Os token OAuth são temporários e expiram no espaço de 1 hora. Neste sentido é necessário verificar se a resposta é um erro de autenticação (401) e proceder à autenticação do utilizador.

Aqui está um exemplo retirado de uma apresentação da Google IO 2011 (ficheiro PowerPoint disponível aqui , slide #50).

@Override
    protected ActivityFeed doInBackground(Void... params) {
     try {
        // execute HTTP requests
     } catch (HttpResponseException e) {
        if (e.response.statusCode == 401) {
          accountManager.invalidateAuthToken(accessProtectedResource.getAccessToken());
          accessProtectedResource.setAccessToken(null);
          SharedPreferences.Editor editor2 = settings.edit();
          editor2.remove(PREF_AUTH_TOKEN);
          editor2.commit();
          getAuthToken(account);
        }
     }

API Access Key

Para além de lidar com as contas de utilizador necessitara de uma chave de acesso fornecida pela Google, que permite aceder ao conteúdo dos utilizadores através da API. Eis um exemplo com uma chave falsa:

buzz = new Buzz(new NetHttpTransport(), accessProtectedResource, new AndroidJsonFactory());
buzz.accessKey = "ABCdef123_9q";

Pode registar-se para ter uma chave através da Google API Console . Mais instrucções sobre como gerar uma chave .

Google Buzz API

O Google APIs Explorer é uma ferramenta muito útil para testar o formato do JSON retornado para cada pedido. Embora não necessite usar directamente o JSON, o explorador é útil para descobrir o nome dos campos e que campo retorna que informação.

Há uma apresentação da Google IO, Best Practices for Accessing Google APIs on Android , que dá algumas dicas sobre o uso de APIs da Google. O orador, Yaniv Inbar, fornece alguns exemplos baseados na API do Google Buzz. Pode encontrar a versão completa e funcional do código aqu i. Este código foi o ponto de partida para a nossa aplicação.

Limitações

A Google Buzz API Java Client 1.0.0 beta que usamos na nossa aplicação não está 100% implementada para alguns dos atributos JSON. Nestes casos terá que usar o JSON de forma um pouco incómoda. Eis o que eu tive que fazer neste caso:

ArrayList< ArrayMap<String, Object> > o = (ArrayList<ArrayMap<String, Object>>) a.links.unknownFields.get(linkType);
String s = (String) o.get(0).get("href");

Para além disto, algumas das mensagens na sua lista podem não ser publicas, neste caso a API retorna a mensagem:

"Private post only viewable at https://plus.google.com/xxx/posts/xxx"

Próximo: Como lidar com erros

Android 101: Ambiente de desenvolvimento e criação do projecto

nunof — Mon, 14 Nov 2011 17:08:30 +0000

O primeiro passo é instalar o ambiente de desenvolvimento. Vamos usar o Eclipse, o IDE recomendado.

Instalar e configurar o SDK do Android e o ambiente de desenvolvimento

Para começar vai precisar de:

Instalar o Eclipse (3.5 ou superior): Usei a edição "Eclipse IDE for Java Developers". Estou a usar a release Helios (3.6).
Instalar o JDK (5 ou superior): não basta instalar o JRE. É preciso instalar o JDK (estou a usar a versão 6).
Instalar o SDK do Android.
Instalar o plugin das Android Development Tools (ADT) para o Eclipse: siga as instruções no link.
Adicionar plataformas e componentes usando o AVD manager: certifique-se que adiciona a plataforma Android 3+, as ferramentas do SDK e as APIs da Google.
Para fazer o debug num dispositivo físico (telefone, tablet, etc.) vai precisar de instalar um driver USB. Os drivers vêm por vezes com o software de instalação para o seu dispositivo, mas em muitos casos é necessário fazer o download do site do fabricante.

Também recomendo que usem um sistema de controlo de versão e os respectivos plugins para o Eclipse, embora isso seja fora do âmbito deste artigo. Podem pesquisar no Eclipse Marketplace a partir do próprio Eclipse (através do menu de ajuda), onde encontrarão muitos plugins differentes.

Criar o primeiro projecto Android

Criar o primeiro projecto Android é fácil.

Vão a File > New > Project...
Escolham Android Project em Android.
Especifiquem os detalhes do projecto:
- Project name: Honeybuzz neste caso.
- Build target: vamos escolher a versão Android 3.0 para esta aplicação.
- Application name: o nome da aplicação (normalmente é parecido ou o mesmo nome do projecto, mas não necessariamente).
- Package name: um nome único que identifica a vossa aplicação. Escolham este nome com cuidado para evitar conflictos com outras aplicações. É comum escolher-se este nome no formato com.domain.application. Neste caso escolhemos com.quasibit.Honeybuzz (porque temos o domínio quasibit.com).
- Create activity: deve estar seleccionado para a maior parte das aplicações (uma Activity é basicamente um ecrã de uma aplicação Android) e devem escolher um nome descritivo. Por exemplo, a Activity principal desta aplicação é chamada HoneybuzzListActivity (porque mostra uma listagem dos últimos buzzes).
- Min SDK version: a versão mínima compatível com a vossa aplicação. Para o Honeycomb é a versão 11.

Adicionar bibliotecas externas

Depois de criar o projecto vamos adicionar as bibliotecas que precisamos. Existem diversas formas de definir as dependências. Uma forma popular é usando o Maven, que tem algumas vantagens como fazer o download automático de bibliotecas Java, mas também tem algumas desvantagens: é mais complexo de configurar inicialmente e no caso do Android não é possível iniciar uma sessão de debug num dispositivo a partir do Eclipse, porque as bibliotecas não vão ser incluídas no APK (Android Application Package) desta forma.

Vamos adicionar as bibliotecas manualmente:

Façam download das bibliotecas necessárias.
- Google APIs Client Library for Java: Usei a versão 1.4.1-beta. Façam download da última versão aqui.
- Buzz API: usamos a versão 1-1.0.0-beta para este projecto. Façam também o download do código fonte e do JavaDoc.
Criem uma nova pasta libraries no vosso projecto.
Adicionem as bibliotecas, código fonte e JavaDoc a esta pasta. Certifiquem-se que os ficheiros são copiados (e não são meros links). Faço desta forma para poder guardar tudo no controlo de versões. Adicionei estas bibliotecas:
- google-api-client-1.4.1-beta
- google-api-client-extensions-android2-1.4.1-beta
- google-api-client-extensions-android3-1.4.1-beta
- google-api-client-googleapis-1.4.1-beta
- google-api-client-googleapis-extensions-android2-1.4.1-beta
- google-api-services-buzz-v1-1.0.0-beta
- E estas dependências:
  - gson-1.6
  - guava-r09
  - jackson-core-asl-1.6.7
  - jsr305-1.3.9
- Mais à frente no guia vamos também adicionar bibliotecas para estatísticas, publicidade e registo de erros.
Especifiquem as bibliotecas nas propriedades do projecto.
- Façam right-click no projecto e abram as propriedades.
- Vão a Java Build Path e abram a tab Libraries.
- Adicionem todas as bibliotecas usando a opção Add JARs...:
  - Expandam o vosso projecto e a pasta libraries e escolham o JAR.
  - Expandam os detalhes do JAR e especifiquem a localização do código fonte e do JavaDoc quando disponível.
- Devem ficar com algo semelhante a isto:

O Google Plugin for Eclipse também ajuda a adicionar as APIs da Google ao projecto, mas neste caso não fizemos uso dele.

Configurar o ProGuard

Vamos fazer uma configuração extra para reduzir o tamanho da aplicação. O ProGuard comprime e optimiza ficheiros Java, retirando código que não é usado e fazendo várias optimizações no código restante.

Como configurar o ProGuard para a vossa aplicação Android:

Editar o ficheiro default.properties e adicionar a linha:

proguard.config=proguard.cfg

Editar o ficheiro proguard.cfg e adicionar as linhas seguintes:

# Needed by google-api-client to keep generic types and @Key annotations accessed via reflection

-keepclassmembers class * {
  @com.google.api.client.util.Key <fields>;
}

-keepattributes Signature,RuntimeVisibleAnnotations,AnnotationDefault

# Needed by Guava

-dontwarn sun.misc.Unsafe

Esta é a base inicial do projecto. Em seguida, damos uma breve introdução ao desenvolvimento em Android.

Introdução ao desenvolvimento em Android

O melhor recurso sobre desenvolvimento em Android é o site Android Developers: tem guias de desenvolvimento, referências e recursos.

Neste guia vamos falar de diferentes tópicos, mas não nos vamos focar em demasia nos fundamentais do Android, porque o site Android Developers já faz um bom trabalho nesse aspecto. Para começar recomendo que leiam What is Android? e Application Fundamentals.

Uma visão geral de uma aplicação Android:

A maior parte das aplicações usa Activities. Uma Activity é basicamente um ecrã da aplicação.
Algumas aplicações usam Services quem correm no background. Um Service não tem uma interface e é usado em geral para correr processos de longa duração, como actualizar os dados de uma aplicação.
Para lançar uma Activity ou um Service é necessário declarar um Intent. Um Intent não tem de pertencer à vossa aplicação. Um exemplo de um Intent é abrir uma página web no browser do utilizador.
Cada aplicação tem um manifesto. No manifesto especificam-se todas as Activities, os Services, os widgets, as permissões necessárias e ainda mais. Está na raiz do projecto e é chamado AndroidManifest.xml.
O interface das Activities define-se usando ficheiros de layout. Cada layout contém uma ou mais Views.
Os recursos são guardados na pasta res. Todas as imagens do projecto, os layouts, as strings, as preferências, as configurações e ainda mais, são guardados nessa pasta.
Uma aplicação Android é instalada usando um APK (Android Application Package): é um arquivo compilado com todos os recursos da aplicação. É este arquivo que é instalado nos dispositivos Android.

Antes de continuar recomendo que leiam pelo menos os 4 primeiros tutoriais encontrados no site Android Developers.

Próximo: Trabalhar com a API do Google Buzz

Android 101: Guia de introdução ao desenvolvimento em Android

nunof — Mon, 14 Nov 2011 17:08:00 +0000

Este é o primeiro numa série de artigos sobre desenvolvimento em Android. Tem como objectivo ser uma introdução ao Android, mas o leitor já deverá saber as bases da programação.

Vamos cobrir os básicos e falar de funcionalidades introduzidas no Honeycomb. Iremos passo a passo até termos uma aplicação Android completa. Apesar de nos focarmos no Honeycomb, o mesmo ainda é válido para o Ice Cream Sandwich.

Tivemos a ideia para este guia quando estávamos a desenvolver um cliente para Google Buzz chamado Honeybuzz. Quando o Google+ foi anunciado, decidimos abandonar a aplicação, mas pelo menos queríamos fazer uso do conhecimento adquirido para ajudar outras pessoas. Íamos publicar a aplicação (como demonstração), mas depois do fim do Google Buzz ser anunciado , apercebemos que seria inútil passado pouco tempo.

Vamos usar a aplicação como referência, servindo de exemplo para cada tópico de como o mesmo pode ser aplicado numa aplicação real. De seguida alguns screenshots do Honeybuzz.

A lista de todos os capítulos do guia:

Adicionaremos links à medida que os capítulos forem publicados.

Esperemos que gostem desta série de tutoriais e aguardaremos pelos vossos comentários e sugestões.

Próximo: Ambiente de desenvolvimento e criação do projecto

Broculos.net tem uma Página Google+

nunof — Sat, 12 Nov 2011 18:37:35 +0000

Agora também nos pode seguir no Google+! A Google anunciou recentemente as Páginas Google+, uma forma de marcas, empresas e organizações comunicarem com os seus clientes e fãs.

Adicione-nos a um dos seus círculos do Google+ e mantenha-se actualizado com os nossos artigos e notícias.

Como criar uma Página Google+

É bastante simples criar uma Página Google+. Visite Create a Google+ Page, escolha o tipo de página que deseja e preencha todos os dados.

Para candidatar a sua página ao Direct connect, que é uma forma dos utilizadores encontrarem uma página no motor de pesquisa da Google através da simples escrita de + seguido do nome da página, necessita de adicionar o seguinte código HTML ao elemento <head> do seu site:

<link href="https://plus.google.com/PAGE_ID/" rel="publisher" />

Não se esqueça de preencher toda a informação na sua Página Google+, incluindo o URL para o seu site e toda a informação de contacto.

Um Google+ Badge, que se encontra actualmente em preview, permite a um utilizador adicionar a sua página aos seus círculos directamente a partir do seu site. Pode usar a ferramenta de configuração de Google+ Badges para gerar o código necessário. Use um badge estático entretanto, enquanto o badge padrão se encontra em preview, para se certificar que todos os seus visitantes vêem um link para a sua Página Google+. Pode ver o nosso badge na coluna do lado direito.

SharePoint 2010 Branding: Navegação de topo 100% horizontal

dsilva — Mon, 07 Nov 2011 12:00:19 +0000

Em SharePoint 2007 a navegação de topo era um emaranhado de tabelas interminável. Não era possível tentar mudar o design visual da navegação por defeito muito para alem das cores e do espaçamento. Agora, em Sharepoint 2010, a navegação é constituída por listas. Isto possibilita aos front-end developers criar uma grade variedade de designs diferentes. Neste artigo dar-vos-ei alguns exemplos de como se pode fazer a navegação aparecer horizontalmente. O código que vos vou fornecer é o mínimo necessário para cumprir o que se pretende para que possa ser facilmente reutilizado.

O nosso ponto inicial:

Uso uma navegação com apenas dois níveis, se precisar de acomodar mais níveis terá que adaptar este código para acomodar os níveis extra.

Mostrar o segundo nível apenas durante o hover

Aqui quis manter o comportamento normal da navegação à excepção do segundo nível, que vai aparecer na horizontal. A sublinhar, a criação de algum espaço livre abaixo do primeiro nível para acomodar o espaço necessário ao segundo nível, assim a navegação não vai aparecer por cima do conteúdo.

Estado normal:

Hover sobre a tab 'Work':

O código explica-se a si próprio. Em caso de dúvida adicionei alguns comentários nas declarações mais importantes.

.s4-toplinks {
	padding-bottom: 23px; /* criar espaço para caber a navegação de segundo nível */
	position: relative;
}

.s4-toplinks .s4-tn li {
	position: static !important; /* a navegação de segundo nível fica posicionada relativamente em relação ao contentor .s4-toplinks */
}

/* hover 2nd level */
.s4-tn li.hover-off ul.dynamic,
.s4-tn li.hover ul.dynamic {
	left: 0 !important;
	bottom: 0 !important;
	top: auto !important; /* reset */
}

.s4-toplinks li  > ul.dynamic li.dynamic {
    float: left;
}

Mostrar o segundo nível para a tab seleccionada (sempre visível)

Esta solução é bastante útil visto que é possível visualizar o segundo nível de navegação do site em que nos encontramos. Todos os outros menus do segundo nível (tabs não seleccionadas) permanecem verticais. Veja o exemplo seguinte de como fazer isto.

Estado normal (quando dentro do site "Work"):

Hover sobre outra tab:

.s4-toplinks {
	padding-bottom: 23px; /* criar espaço para caber a navegação de segundo nível */
	position: relative;
}

.s4-toplinks .s4-tn li.selected {
	position: static !important; /* a navegação de segundo nível fica posicionada relativamente em relação ao contentor .s4-toplinks */
}

/* hover 2nd level */
.s4-tn li.selected ul.dynamic,
.s4-tn li.selected.hover-off ul.dynamic,
.s4-tn li.selected.hover ul.dynamic {
	left: 0 !important;
	bottom: 0 !important;
	top: auto !important; /* reset */
}

.s4-toplinks li.selected  > ul.dynamic li.dynamic {
    float: left;
}

Mostrar o segundo nível para a tab seleccionada (sempre visível) e durante o hover

Quero que o segundo nível da navegação esteja sempre visível para a tab seleccionada. Quando faço hover em outras tabs a navegação actual vai ser escondida e aparecerá a lista da navegação da tab seleccionada. Vamos usar JavaScript neste exemplo.

Estado normal (quando dentro do site "Work"):

Hover sobre a tab "News":

Isto é uma implementação com os mínimos essenciais. Talvez queira dar algumas pistas visuais através do estilo para identificar a tab seleccionada.

O CSS:

.s4-toplinks {
	padding-bottom: 23px; /* criar espaço para caber a navegação de segundo nível */
	position: relative;
}

.s4-toplinks .s4-tn li {
	position: static !important; /* a navegação de segundo nível fica posicionada relativamente em relação ao contentor .s4-toplinks  */
}

/* hover 2nd level */
.s4-tn li.selected ul.dynamic,
.s4-tn li.hover-off ul.dynamic,
.s4-tn li.hover ul.dynamic {
	left: 0 !important;
	bottom: 0 !important;
	top: auto !important; /* reset */
}

.s4-toplinks li > ul.dynamic li.dynamic {
    float: left;
}

O JavaScript:

jQuery(document).ready(function () {
	handleHorizontalNav();
});

function handleHorizontalNav() {
	jQuery(".s4-toplinks li.dynamic-children:not(.selected) > a, .s4-toplinks li.dynamic-children:not(.selected) > ul.dynamic").hover(
	function(){		
		jQuery(".s4-tn li.selected > ul.dynamic").css("display", "none");
	},		
	function(){
		jQuery(".s4-tn li.selected ul.dynamic").css("display", "block");
	});
	
	jQuery(".s4-toplinks li.selected a").unbind('hover');
}

Marcar o elemento seleccionado no segundo nível

Um problema que se cria quando o segundo nível de navegação esta sempre visível é que não existe um selector (id ou class) para o elemento seleccionado no segundo nível. Podemos resolver este problema usando JavaScript.

String.prototype.startsWith = function(str){
    return (this.indexOf(str) === 0);
}

function setActiveItemInTopNavSecondLevel() {
    var cururl = window.location.pathname;
    var menu = jQuery(".s4-toplinks li.selected ul.dynamic");

    menu.children("li").each(function (i, e) {
        var item = jQuery(this).find("a.menu-item");
        var url = item.attr("href");
		
        if (cururl.startsWith(url)) {
            item.addClass("selected");
        }
    });
}

Centrar a navegação de segundo nível relativamente à sua raiz

Outra pista visual que podemos dar é centrar o segundo nivel horizontalmente relativamente à sua tab raiz, em vez de estar tudo alinhado à esquerda. Vejamos como fazer isto com a ajuda de JavaScript.

Mudei um pouco o tamanho dos elementos neste exemplo para que o efeito seja mais visível

function centerTopNavSecondLevel() {
    jQuery(".s4-toplinks li.dynamic-children").each(function (i, e) {
		var menu = jQuery(this).children("ul.dynamic");
		
		if (jQuery(this).offset() != null) {
            left = (jQuery(this).offset().left - (menu.width() / 2)) + (jQuery(this).width() / 2);
        }
		
		// check if the menu doesnt overflow to the left
        if (left < 0) {
            left = 0; 
        }
		
        menu.children("li").first().css("margin-left", left + "px");
    });
}

SharePoint 2010 Branding: A master page application.master

dsilva — Mon, 31 Oct 2011 10:55:57 +0000

Em SharePoint 2010 um pequeno número de páginas ainda usa a masterpage application.master (por exemplo: /_layouts/listkeywords.aspx). Todas as páginas que estão no sistema de ficheiros usam esta master page. Isto é um problema se que quisermos mudar os estilos destas páginas.

Após alguma pesquisa descobri este artigo da Microsoft que fala em um alguns métodos para modificar um ficheiro no sistema de ficheiros, e chega a recomendar um deles. Alterar ficheiros no sistema de ficheiros é um cenário não suportado pelo SharePoint. Mas se a Microsoft explica como o fazer e ainda recomenda um dos métodos, não vou perder mais tempo com o assunto.

Vou tornar este processo automático fazendo a instalação da minha master page através de uma solução. Crio também uma versão de backup do ficheiro original. Em caso de desastre o ficheiro fica salvaguardado no servidor. Eis a minha solução:

Se o portal suportar a versão 3 do SharePoint UI, talvez precise instalar uma versão do application.master. E, como sempre, respeite o ficheiro. Não copie indiscriminadamente código de outra masterpage. Use os controlos que já lá estão. Mude o layout da mesma forma que mudaria outra masterpage qualquer.

Pode também usar uma application.master alterada de forma mais apropriada e completamente suportada usando um HTTP module. Se pesquisar online certamente encontrara informação sobre como o fazer.

SharePoint 2010 Branding: HTML5 masterpage para SharePoint 2010

dsilva — Wed, 26 Oct 2011 07:00:06 +0000

O Kyle Schaeffer criou uma master page HTML5 para Sharepoint 2010. Estava a testar a master page e como as instruções de instalação são todas manuais (uploads de ficheiros para bibliotecas SharePoint) decidi automatizar o processo. Criei uma solução Visual Studio com todos os ficheiros e uma feature que permite activar toda a funcionalidade.

A solução incluí todos os ficheiros criados pelo Kyle Schaeffer, sob a licença Creative Commons Attribution 3.0. A única coisa fornecida por mim é a solução, todas as instruções de instalação e a feature que activa tudo através do seu Event Receiver.

Não deixe de ler o artigo completo V5, The Responsive HTML5 master page for SharePoint 2010. Há limitações importantes nesta solução.

A solução ficou assim:

De relevo é o metodo do Event Receiver que altera a masterpage activa (site e system masterpage).

private void UpdateMasterPage(SPWeb web, String newMasterFileName) {
            try {                
                bool webAllowUnsafeUpdates = web.AllowUnsafeUpdates;

                web.AllowUnsafeUpdates = true;

                web.CustomMasterUrl = web.CustomMasterUrl.Replace(Path.GetFileName(web.CustomMasterUrl), newMasterFileName); // Site Masterpage
                web.MasterUrl = web.MasterUrl.Replace(Path.GetFileName(web.MasterUrl), newMasterFileName); // System Masterpage
                web.Update();

                web.AllowUnsafeUpdates = webAllowUnsafeUpdates;               
            }
            catch (Exception e) {
            }
}

A feature é activada ao nível da site collection.

Pode descarregar a solução Visual Studio e o ficheiro wsp pronto a instalar. Ambos estão disponíveis sob a mesma licença (Creative Commons Attribution license 3.0) que os ficheiros originais. Veja os ficheiros anexos no fim do artigo.

Bom proveito!

SharePoint 2010 Branding: Mudar as setas no menu de Site Actions e Welcome

dsilva — Mon, 24 Oct 2011 14:00:00 +0000

Já se perguntou como mudar a seta nos menus de Site Actions e Welcome?

Veja em baixo como pode fazê-lo. Escondendo a imagem original e dando uma imagem de background ao elemento que continha a imagem:

.ms-viewselector-arrow {
    background: transparent url('/_layouts/images/custom/new-arrow.png') no-repeat scroll 0 0;
    height: 4px; /* height of the image */
    width: 5px; /* width of the image */
}

.ms-viewselector-arrow img {
    display: none;
}

Não é uma grande alteração mas ajuda a manter a consistência do branding.

Oferta: IDE de PHP CodeLobster edição Profissional

nunof — Sat, 22 Oct 2011 19:38:04 +0000

Actualização

Temos uma oferta especial para todos os programadores de PHP. Vamos oferecer 3 licenças profissionais do IDE de PHP CodeLobster. O CodeLobster é um editor gratuito de PHP, mas também tem uma versão Profissional com vários plugins pagos para CMSs e frameworks comuns.

Como participar

O concurso é simples: basta deixar um comentário neste artigo e daqui a duas semanas os vencedores serão escolhidos à sorte. Certifiquem-se que preencheram correctamente o vosso email quando colocarem o vosso comentário, para podermos contactá-lo se for um dos vencedores.

Se for novo ao nosso site pode subscrever ao nosso RSS feed e ficar a par de artigos e ofertas futuras.

A acompanhar a oferta temos também uma análise ao editor CodeLobster. A CodeLobster Software foi generosa o suficiente para nos oferecer as licenças do concurso e para teste, mas a análise é da minha única responsabilidade e reflecte apenas a minha visão independente.

Análise ao editor de PHP CodeLobster

Prós

Editor rápido e simples.
Bons plugins para Drupal e outros CMSs e frameworks (apenas na versão Professional).
Versão portável.
Funcionalidades de FTP e controlo de versões.

Contras

Ausência de perfis (i.e. perfis diferentes por projecto - desenvolvimento, teste, produção, etc.).
Suporte SVN limitado (para já).
Não tem gestor de code snippets.
Apenas disponível para Windows.

Editor de PHP CodeLobster

CodeLobster é um IDE de PHP para Windows. Há uma versão gratuita (para a qual precisa de se registar ) com o suporte habitual para escrever código PHP/JS/HTML/CSS e há também uma versão Professional com plugins para CMSs e frameworks comuns.

A instalação é simples. O CodeLobster pode associar-se ao sistema de ficheiros para todo o tipo de ficheiros que suporta, mas o que me chamou à atenção durante a instalação foi a possibilidade de instalar uma versão portável. É um bom pormenor que permite mover a pasta do CodeLobster para outra máquina. Se não escolher durante a instalação, pode fazê-lo mais tarde nas preferências.

Depois da instalação vai reparar num ecrã de trial. Se for usar a versão gratuita tem de requisitar um código que lhe será enviado para o email.

A primeira coisa que chama à atenção quando o editor abre é a quantidade de barras de ferramentas e janelas que estão abertas. Apesar de ser bom haver tantas, acho desnecessário estarem todas abertas.

Felizmente é fácil de adaptar a interface, podendo fechar ou mover as janelas e barras de ferramentas que pretender.

A ausência de um ecrã de boas-vindas é também do meu gosto. Muitos IDEs começam com uma janela de boas-vindas ou com as últimas notícias. Acho isto desnecessário, apenas quero ir directamente para o último projecto e ficheiros em que estava a trabalhar, que é o que o CodeLobster faz. No entanto, se preferir ter umas notícias quando abre o editor, tal é possível, pelo menos desde que tenha alguns plugins (estando tal no entanto desactivado por omissão).

O CodeLobster é em geral mais simples do que outros IDEs mais avançados como o NetBeans ou o Eclipse, que têm de suportar uma quantidade maior de linguagens e funcionalidades. Como o CodeLobster se foca em PHP e HTML/JS/CSS, torna-se mais simples e fácil de usar e também não tem de suportar funções desnecessárias.

Vamos agora falar de algumas das suas funcionalidades.

Code highlighting e suporte de themes

O CodeLobster suporta vários themes, se não gostar do que vem por omissão. Se já tiver um ficheiro aberto por detrás da janela de preferências, pode ver como um theme vai ficar, bastando para isso seleccioná-lo. Existem themes escuros e também pode desenhar o seu próprio theme.

Eu usei o theme Zend for Eclipse, que tem umas cores suaves.

Autocomplete

A funcionalidade de autocomplete surpreendeu-me, porque detecta as chaves nos vectores!

Debugging de PHP

Uma funcionalidade de debugging é fundamental num IDE. Neste respeito, o CodeLobster não desiludiu e foi muito fácil configurar o debugger e funcionou à primeira tentativa.

Já tinha o meu servidor Apache ligado, então fui às preferências do debugger e usei a função autodetect, que funcionou muito bem.

FTP

A maioria dos IDEs vem com suporte para FTP. O CodeLobster tem funcionalidades de download e upload por FTP.

Uma das coisas que me enlouqueceu foi não ser óbvio como criar uma ligação FTP. Aparentemente, não sou o único a pensar assim e, depois de procurar nos fóruns do CodeLobster , descobri que se configuram as ligações de FTP na janela Explorer. Não é muito intuitivo, mas pelo que sei é algo que irá mudar no futuro.

Depois de criar a ligação, abra as propriedades do projecto e escolha a sua ligação. Em seguida pode usar as funcionalidades de upload e download.

Suporte de controlo de versões

O CodeLobster vem com suporte para controladores de versões. Tem suporte limitado para GIT e SVN. Eu uso o TortoiseSVN e, para já, este ainda não é suportado pelo IDE. No entanto, é algo que será adicionado em versões futuras.

Se usar SVN, o IDE suporta o Subversion para Windows .

Plugins pagos

Pode adquirir plugins que adicionam suporte para vários CMSs e frameworks. Vou concentrar-me no plugin para o Drupal, mas os outros são parecidos. Vejam no site oficial do CodeLobster mais informação sobre cada plugin.

Plugins existentes:

CakePHP plug-in
CodeIgniter plug-in
Drupal plug-in
Facebook plug-in
JQuery plug-in
Joomla plug-in
Smarty plug-in
Symfony plug-in
WordPress plug-in
Yii plug-in
SQL manager

Plugin para Drupal do CodeLobster

Eu uso o Drupal, por isso foi com agrado que descobri que o CodeLobster tinha um plugin para Drupal. O plugin ajuda na criação de projectos e módulos e também traz algumas funcionalidades adicionais.

Para criar um projecto Drupal existem duas opções: criar um site Drupal vazio (pode escolher a versão do Drupal e outros detalhes adicionais) ou começar com site “típico” de Drupal.

Wizard de projecto: Typical Drupal Site

O template Typical Drupal Site só suporta o Drupal 6 e usa actualmente a versão 6.19 do Drupal, que não é a última. Depois de criar o projecto, o site deve ser actualizado para a última versão do Drupal, que inclui várias correcções de segurança.

O wizard oferece diversas opções de configuração. Algumas notas:

Tem de criar uma base de dados antes de avançar com o wizard.
Certifique-se que o URL para o projecto está correcto na tab Admin ou o wizard irá falhar.
Pode escolher o tipo de conteúdo que quer na tab Content.

Não usaria este wizard para os meus projectos, não só porque usa o Drupal 6, mas também porque prefiro sempre fazer desenvolvimento à medida. Apesar de apreciar o facto de vir com vários módulos custom que podem ser ajustados depois de se criar o projecto.

Wizard de projecto: Empty Drupal Site

O wizard Empy Drupal Site é mais do meu agrado. Permite a escolha da versão do Drupal a instalar e, tanto quanto me apercebi, faz download da última versão a partir do site (pelo menos desde que se escolha Drupal 7), o que é bastante prático.

O wizard vai criar uma base de dados e um site Drupal vazio, mas pode escolher os módulos que quer activos.

Wizard para módulos Drupal

Estava à espera de encontrar o wizard quando fizesse right-click no projecto ou na pasta dos módulos, por isso demorei algum tempo até encontrar a opção no menu Plugins que se encontra no topo.

O wizard é uma forma rápida de criar a pasta com os ficheiros essenciais do módulo. Poupa-nos pouco tempo, mas ajuda a suavizar o processo de desenvolvimento.

Hooks para módulos Drupal e autocomplete

O plugin torna fácil a criação de hooks para os módulos.

Não apenas isso, mas também tem autocomplete para as funções de theme e dos formulários Drupal.

Ajuda de contexto

A ajuda contextual vai abrir um browser com a página da API do Drupal para um método ou constante particular. Já não é preciso pesquisar no Google cada vez que quer encontrar a documentação de um método.

Encontrar uma função de menu

Outra funcionalidade que o plugin Drupal suporta é a possibilidade de encontrar uma função de menu pelo caminho ou vice-versa.

Conclusão

O CodeLobster é um bom e simples editor que todos os programadores de PHP devem considerar. Gosto da sua simplicidade e velocidade. Para mim, o principal problema é a falta de suporte para o TortoiseSVN, mas isso será adicionado no futuro.

A minha segunda queixa é a falta de perfis para os projectos. Por exemplo, tendo um perfil de desenvolvimento onde poderia configurar a pasta local (ou ligação FTP) para copiar os ficheiros e um URL local para fazer debug ao site. Depois teria perfis para outros ambientes (teste, aceitação e produção). É sempre possível alterar as propriedades do projecto de cada vez, mas é pouco prático. Não é uma função essencial, mas seria algo que eu usaria com alguma frequência.

Fora isso, vejo-me a usar o IDE mais vezes. A falta de disponibilidade para outros sistemas operativos pode afastar alguns utilizadores. A adição de um gestor de code snippets com suporte de autocomplete seria também algo bom de ter numa versão futura.

SharePoint 2010: People picker não mostra sugestões

dsilva — Thu, 20 Oct 2011 14:25:02 +0000

O campo de people picker em SharePoint 2010 não mostra sugestões, mesmo quando aparentemente foram encontradas sugestões. Não testei isto em todos os campos possíveis, mas isto acontece sempre no Summary Links webpart quando tentamos inserir um novo link.

Tentei clicar como indica a mensagem de erro. Mesmo na tooltip dizia que existiam resultados.

Cliquei e nada aconteceu. Desesperei, cliquei a torto e a direito até que uma combinação mágica de cliques e teclas tornou a altura do campo maior e consegui perceber o que se passava:

Sim... O menu estava a abrir dentro do campo, ficando obviamente invisível se o campo só tiver uma linha. Depois de inspeccionar o HTML e CSS descobri o problema, eis como o resolver:

body div.ms-inputuserfield {
    overflow-x: visible !important;
}

Android SDK 4.0 disponível para programadores

dsilva — Wed, 19 Oct 2011 20:56:57 +0000

A versão unificada do Android, tanto para tablets como telemóveis, foi oficialmente anunciada hoje e o seu SDK já está disponível para programadores.

A sublinhar nesta versão é a unificacão das versões 2.x e 3.x, o que vem simplificar o processo de desenvolvimento e design de aplicações.

Algumas funcionalidades a salientar no SDK do Android 4.0:

Social API. Foi demonstrada na apresentação através da aplicação People. O Android agora fornece a integração dos contatos com as suas actividades sociais online.
Android Beam. Baseado em NFC, permite partilhar informação ou estabelecer uma ligação entre dois telemóveis, bastando aproximá-los fisicamente.
Encontras mais informação no site dos Android developers.

Não percas também a apresentação do Samsung Galaxy Nexus e do Android 4.0 que lhe dá vida, aqui.

SharePoint: Como usar URLs relativos na masterpage da maneira correcta

dsilva — Mon, 17 Oct 2011 15:01:51 +0000

Descobri que tenho vindo a usar caminhos relativos de forma incorrecta nas masterpages do SharePoint. Vejamos um exemplo de como eu usava os URLs, com um link para a homepage e uma imagem para o logótipo.

<a href="http://www.broculos.net/pt" class="logo">
	<img src="/Style Library/CustomStyle/Images/logo.png" alt="" />
</a>

Este código funciona às mil maravilhas se a raiz site collection se encontrar na raiz do URL, por exemplo: http://www.example.sp2010.dev/.

Se este não for o caso, como em site collections com URLs deste tipo: http://www.example.sp2010.dev/sites/anothersitecolection/ , o meu link vai ligar a http://www.example.sp2010.dev/ e a source da imagem vai estar a apontar para uma biblioteca errada. Eis como URLs relativos devem ser declarados nas masterpages:

<a href='<SharePoint:EncodedLiteral runat="server" text="<%$SPUrl:~SiteCollection/%>" EncodeMethod="HtmlEncode"/>' class="logo">
	<img src='<SharePoint:EncodedLiteral runat="server" text="<%$SPUrl:~SiteCollection/Style Library/CustomStyle/Images/logo.png%>" EncodeMethod="HtmlEncode"/>' alt="" />
</a>

SharePoint 2010 Branding: Caixas de pesquisa originais apenas com CSS

dsilva — Tue, 20 Sep 2011 11:30:00 +0000

Quer fazer algo mais complexo com os estilos da caixa de texto do SharePoint usando CSS? Aqui tem um exemplo de como o fazer.

A nossa caixa original:

O resultado final:

A ideia principal nesta implementação é colocar uma imagem com todos os elementos da pesquisa (input e botão) como fundo da área de pesquisa. Depois, ajustam-se as alturas e larguras dos elementos (input e botão) ao que temos no background. Para terminar, é apenas necessário camuflar os elementos, todas as borders e backgrounds têm de desaparecer.

Para perceber melhor como isto funciona, em baixo tem o exemplo da caixa inacabada com os controlos ainda visíveis. O botão parece pequeno demais porque a imagem que contem é do tamanho que se vê, no entanto a largura do botão deve ser a mesma do background.

Aqui esta o código que usei:

#s4-searcharea {
    background: transparent url('/_layouts/images/custom/search-box.png') no-repeat scroll 0 0;    
    height: 30px; /* height of image */
    width: 354px; /* width of image */
}

.s4-search input.ms-sbplain {
    background: transparent;
    border-color: transparent !important;
    color: #9ca052;
    height: 23px;
    padding-left: 30px; /* to acomodate the magnifier icon */
    padding-top: 0 !important;   
    width: 247px !important;
}


#banner .ms-sbgo a {
    border-color: transparent !important;
    display: block;
    height: 30px;
    width: 70px !important;
}

#banner .ms-sbgo > a > img {
    display: none;
}

Aqui ficam outros exemplos onde usei esta técnica:

Como restaurar um backup de SQL Server de uma base de dados de SharePoint

nunof — Thu, 08 Sep 2011 17:20:51 +0000

Existem vários métodos para fazer e restaurar backups de conteúdo em SharePoint. O próprio SharePoint oferece várias ferramentas para backup/restauro: tanto através da interface na Central Administration como através da linha de comandos com a ferramenta STSADM.

Neste artigo vou discutir uma abordagem diferente: como restaurar um backup de SQL Server de uma base de dados de SharePoint. É comum ter um plano programado de backups num SQL Server, por isso é uma boa alternativa quando os outros métodos não se encontram disponíveis.

O principal problema que vão encontrar é certificarem-se que a base de dados não está a ser usada quando quiserem fazer o restauro, porque o SharePoint tem muitos processos que acedem à base de dados, mesmo quando ninguém está a visitar o site.

Parem o Windows SharePoint Services Timer
- Vão a Administrative Tools e abram Services.
- Localizem o Windows SharePoint Services Timer.
- Vão a propriedades, certifiquem-se que Manual é a opção selecionada para Startup type e parem o serviço.
- Esperem alguns minutos até que todos os processos estejam concluídos.
Terminem os processos que estejam a aceder à base de dados
- Abram o SQL Server Management Studio e liguem-se ao servidor da base de dados.
- Expandam Management e abram o Activity Monitor.
- Vejam que processos estão a usar a vossa base de dados e esperem que eles terminem ou terminem-os manualmente.
Executem o script para restaurar o backup
- Abram uma nova query.
- Usem o seguinte script, que muda o modo de acesso para um utilizador de cada vez e depois reverte a mudança no final.

USE MASTER
ALTER DATABASE [DATABASE_NAME] SET SINGLE_USER WITH ROLLBACK IMMEDIATE 
RESTORE DATABASE [DATABASE_NAME] FROM  DISK = 'D:\PATH\Backup.bak' WITH  FILE = 1,  NOUNLOAD,  REPLACE,  STATS = 10
ALTER DATABASE [DATABASE_NAME] SET MULTI_USER WITH ROLLBACK IMMEDIATE
GO

Não se esqueçam de iniciar novamente o Windows SharePoint Services Timer:

Vão a Administrative Tools e abram Services.
Localizem o Windows SharePoint Services Timer.
Vão a propriedades, certifiquem-se que Automatic é a opção selecionada para Startup type e iniciem o serviço.

Como saber se o JavaScript está activo a partir do servidor em C#/.NET

nunof — Thu, 25 Aug 2011 21:35:09 +0000

O .NET não inclui uma maneira de detectar se o JavaScript está activo a partir do servidor (é possível detectar se JavaScript é suportado, mas o utilizador poderá tê-lo desactivado). É possível fazer isto usando várias técnicas. Neste artigo vou explicar como conseguir isto usando os PageMethods do .NET.

PageMethods em .NET

PageMethods, como o nome indica, são métodos que pertencem a uma página ASP.NET, mas com uma diferença - estes métodos podem ser chamados do lado do cliente, como se se tratassem de métodos de um Web Service, mas sem ter que fazer um.

Um PageMethod tem de ser declarado public e static e marcado com o atributo WebMethod. Além disso, é preciso incluir na página um ScriptManager que tenha a propriedade EnablePageMethods em true.

Esta técnica permite chamar métodos do servidor a partir do cliente, mas sem ter o trabalho de construir um Web Service - o .NET fará tudo o que é necessário nos bastidores.

Detectar se o JavaScript está activo

A ideia desta solução é usar JavaScript para chamar um método do servidor que guardará numa variável de sessão se o JavaScript está activo. Se o JavaScript não estiver activo, o método nunca será chamado, portanto saberemos que não está activo.

Este é o código necessário:

public class DetectJavascriptPage : System.Web.UI.Page {
	protected const string JAVASCRIPT_ENABLED_KEY = "JavascriptEnabled";

	public bool IsJavascriptEnabled { get { return GetJavascriptEnabled(); } }

	protected override void OnPreRender( EventArgs e ) {
		base.OnPreRender( e );

		// Verify that the startup script isn't already registered (postbacks)
		if (!this.ClientScript.IsStartupScriptRegistered("JavascriptTest_Startup"))
		{
			// Form the script to be registered at client side.
			StringBuilder sb = new StringBuilder();
			sb.Append("<script lang='javascript'>");
			sb.Append("PageMethods.SetJavascriptEnabled(true, SetJavascriptOnSucceeded, SetJavascriptOnFailed);");
			sb.Append("function SetJavascriptOnSucceeded() { }");
			sb.Append("function SetJavascriptOnFailed(error) { }");
			sb.Append("</script>");

			// Register the startup script
			this.ClientScript.RegisterStartupScript(typeof(JavascriptTest), "JavascriptTest_Startup", sb.ToString());
		}
	}

	[WebMethod]
	public static void SetJavascriptEnabled(bool enabled)
	{
		if (HttpContext.Current.Session[JAVASCRIPT_ENABLED_KEY] != null)
		{
			HttpContext.Current.Session[JAVASCRIPT_ENABLED_KEY] = enabled;
		}
		else
		{
			HttpContext.Current.Session.Add(JAVASCRIPT_ENABLED_KEY, enabled);
		}
	}

	[WebMethod]
	public static bool GetJavascriptEnabled()
	{
		if (HttpContext.Current.Session[JAVASCRIPT_ENABLED_KEY] != null)
		{
			return (bool)HttpContext.Current.Session[JAVASCRIPT_ENABLED_KEY];
		}

		return false;
	}
}

No pre render inclui-se código JavaScript que irá chamar o método da página, que por si irá definir a variável de sessão. Para saber se o JavaScript está activo ou não, só é preciso chamar a propriedade IsJavascriptEnabled que foi adicionada à classe da página.

SharePoint 2010 Branding: Mostrar a zona do titulo quando a ribbon esta expandida

dsilva — Mon, 08 Aug 2011 07:00:08 +0000

Por defeito, quando a ribbon esta expandida a zona do título desaparece por completo. Isto é algo que habitualmente os clientes não gostam, por isso é algo que necessito quase sempre corrigir.

Ribbon colapsada:

Ribbon expandida: a zona do título desapareceu:

Portanto, precisamos substituir a declaração que esconde o título.

Como fazê-lo? Adicionando esta regra ao CSS:

#s4-titlerow { 
    display: block !important; 
}

Agora a zona do título estará sempre visível. A ribbon ao abrir-se “empurra” o título para baixo:

SharePoint BDC: Criar um ADF com o BDC Definition Editor da Microsoft

nunof — Thu, 04 Aug 2011 21:03:42 +0000

Business Data Catalog (BDC) permite-lhe integrar uma base de dados externa num ambiente SharePoint. Para fazer isso, é preciso criar um Application Definition File (ADF) e importá-lo para o SharePoint.

Um ADF é basicamente um ficheiro XML com a informação necessária para descrever as entidades e métodos de acesso à base de dados. Existem algumas aplicações a pagar que ajudam a gerar os ADFs, mas a própria Microsoft fornece uma ferramente gratuita para o mesmo efeito.

Neste artigo vou descrever como obter esta ferramenta e alguns incómodos que encontrei pelo caminho.

Instalar o BDC Definition Editor

O BDC Definition Editor da Microsoft está incluído no SDK do SharePoint Server 2007. Depois de instalar o SDK, podem encontrar o instalador do BDC Definition Editor em "C:\Program Files\2007 Office System Developer Resources\Tools\BDC Definition Editor" (por omissão).

Se querem instalar o BDC Definition Editor noutra máquina, podem copiar a pasta toda e correr a instalação noutro sítio. Os ambientes suportados são Windows Server 2003 (apenas na versão En-US) e Windows XP (apenas na versão En-US). O ficheiro que têm de correr é o setup.exe. Este ficheiro assegurará que todos os requisitos estão instalados e, se não estiverem, instala-los-á:

Microsoft .NET Framework 2.0
Microsoft SQL Server 2005 Express Edition
Windows Installer 3.1

São basicamente 90MB de instalação para uma ferramenta de 2MB. Fantástico...

Assim que estiver instalado, podem encontrar a ferramenta no menu inicial do Windows em ApplicationDefinitionDesigner.exe.

Criar o Application Definition File

Não quero perder muito tempo a explicar o uso do Application Definition Designer (também conhecido por BDC Definition Editor), porque é bastante simples de usar:

Começem por adicionar um novo sistema LOB (se já tiverem um ficheiro podem importá-lo também).
Escolham Connect to Database.
Escrevam a connection string (se não tiverem bem a certeza do que escrever vejam alguns exemplos de connection strings para SQL Server 2005).
Vai aparecer uma listagem de todas as tabelas. Arrastem as tabelas necessárias e façam os ajustes necessários (e.g. remover alguns campos).

Depois deste passo, criar o ADF é bastante simples. Basta usar o botão Export e gravar o ficheiro.

Método Finder para a Business Data List web part

Antes de gravarem o ficheiro, deixem-me explicar um senão. Por razões que desconheço, o Application Definition Designer não gera um método necessário para o uso da Business Data List web part. Desta forma, se importarem o ficheiro ADF no seu estado actual, irão obter o seguinte erro na Business Data List web part:

O bizarro é que isto pode ser facilmente corrigido. A web part precisa de um método Finder na entidade BDC, mas este não é criado por omissão. No entanto, dois outros métodos são gerados. Um desses métodos pode ser facilmeente alterado para ser do tipo Finder, em vez de ter de criar outro método.

Para corrigir isto, abram o Application Definition Designer. Para cada entidade que precisam de usar na Business Data List web part:

Expandam Methods > FindAll_EntityName > Instances.
Escolham a instância (FindAll_EntityName_Instance).
Na propriedade MethodInstanceType escolham Finder.

Uma última coisa que provavelmente vão querer fazer é adicionar alguns parâmetros de saída (i.e. alguns campos adicionais). Por omissão, o método só inclui a chave primária e mais nenhum campo, o que não é muito útil.

Usar autenticação SQL

Se precisam de usar autenticação SQL, vão precisar de adicionar umas propriedades à instância do vossos sistema LOB:

Escolham a vossa instância.
Certifiquem-se que AuthenticationMode é igual a PassThrough e DatabaseAccessProvider é igual a SqlServer.
Abram a colecção de propriedades.
Adicionem os seguintes parâmetros:
- RdbConnection Data Source: o endereço do servidor SQL
- RdbConnection Initial Catalog: o nome da base de dados
- RdbConnection User ID: o nome de utilizador
- RdbConnection Password: a palavra-chave
- RdbConnection Integrated Security: ponham False

Importar o ADF para o SharePoint

Agora é preciso importar o ADF para o SharePoint. É bastante simples:

Abram a Central Administration.
Vão ao Shared Services Provider (SSP) da vossa aplicação.
Em Business Data Catalog escolham Import application definition.
Naveguem para o vosso ficheiro e importem-no.

Assim que estiver importado, podem verificar as entidades. Algo que provavelmente precisam de mudar são as permissões de acesso ao BDC. Podem fazê-lo individualmente para cada entidade, mas é bastante mais fácil alterar para todas ao mesmo tempo:

Na página da vossa aplicação BDC escolham Manage Permissions.
Adicionem todas as contas necessárias com a opção Add Users/Groups (é comum precisarem da conta NT AUTHORITY\Authenticated Users com a permissão Select in Clients).
Agora escolham Copy all permissions to descendants (isto assegurará que as permissões sejam copiadas para todas as entidades).

Usar as Business Data Catalog web parts

Agora que importaram o ADF e configuraram a vossa aplicação BDC, podem usar as BDC web parts que o SharePoint fornece (certifiquem-se que têm as features necessárias activas).

Quando adicionam uma web part, vão encontrar na categoria Business Data várias web parts para se ligarem ao vosso BDC. Uma das mais comuns é a Business Data List web part. Assim que a adicionarem, precisam de editar as suas propriedades e escolher a entidade que querem mostrar.

Também podem ligar uma Business Data List web part a uma Business Data Item web part, que mostra os detalhes de uma linha da tabela apenas. Para fazerem isso, primeiro adicionem a Business Data Item web part e depois vão ao menu de edição de contexto da Business Data List web part e escolham Connections > Send Selected Item To e seleccionem a instância da Business Data Item web part. Agora quando seleccionarem uma das linhas na Business Data List web part, os detalhes vão aparecer na Business Data Item web part.