nice C++ tutorial for beginners, from embarcadero
Those sections of C++ tutorials are very simple. Otherwise they explain the differences between Delphi (pascal) language and C++.
Good job:
Session 1:
Session 2:
Supportare differenti dimensioni di schermo in android grazie ai Fragments
Nello sviluppo di applicazioni mobili diventa sempre più importante il supporto di schermi e dimensioni anche molto diverse a causa del diffondersi di modelli e tipologie di dispositivi sempre più disparati.
Per fortuna Android offre una soluzione veramente intelligente e semplice per aiutarci a sviluppare applicazioni che da un lato siano compatibili col maggior numero possibile di dispositivi ma che, dall’altro, si adattino al meglio agli schermi dei dispositivi in termini di usabilità e sfruttamento della superficie disponibile .
La soluzione sono i FRAGMENT.
In realtà i Fragment offrono altri grandi vantaggi come, ad esempio, poter scomporre le Activity in blocchi elementari (una sorta di “sub-activity”) replicabili e riutilizzabili in più layout o schermate applicative.
In questo articolo ci focalizzeremo su un semplicissimo esempio tramite il quale sviluppare un’Activity (che chiameremo MainActivity) in grado di presentarsi all’utente con due fragment affiancati nel caso lo schermo del dispositivo sia abbastanza grande da consentirlo (es. tablet), mentre negli altri casi gli stessi fragment vengono mostrati sequenzialmente (quasi come se fossero due Activity distinte).
L’ipotesi è quella di avere una listView di oggetti nel primo fragment (SxFragment) e il dettaglio dell’oggetto selezionato nel secondo fragment (DxFragment).
La figura seguente mostra l’esempio.
1) Layout
Predisponiamo due differenti layout per schermi piccoli e grandi. La stessa cosa, ad esempio, può essere fatta per Portrait/Landscape, con più fragmen, etc…
file: /res/layout-large/example_layout.xml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?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="match_parent"> <fragment android:name="com.example.fragments.SxFragment" android:id="@+id/fgmList" android:layout_weight="3" android:layout_width="0dp" android:layout_height="match_parent" /> <fragment android:name="com.example.fragments.DxFragment" android:id="@+id/fgmDetail" android:layout_weight="4" android:layout_width="0dp" android:layout_height="match_parent" /> </LinearLayout> |
file: /res/layout/example_layout.xml
|
1 2 3 4 5 |
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/fgmContainer" android:layout_width="match_parent" android:layout_height="match_parent"> </FrameLayout> |
Da notare che nel secondo layout non sono inclusi staticamente i Fragment e che è invece assegnato un id (fgmContainer) al contenitore che ci occorrerà per agganciare i fragment.
2) Activity principale
|
1 |
public class MainActivity extends Activity |
oppure nel caso di utilizzo della Android Support Library (retrocompatibilità con device che hanno versioni di android < 3.0):
|
1 |
public class MainActivity extends FragmentActivity |
Nel onCreate includiamo il layout e istanziamo dinamicamente il Fragment nel caso in cui siamo alle prese con uno schermo piccolo.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.fragment_contatti); // Check if using the layout version for small screen if (findViewById(R.id.fgmContattiContainer) != null) { // If restored from previous state do not add fragment if (savedInstanceState != null) return; // Dynamically add list fragment SxFragment firstFragment = new SxFragment(); // Eventually pass parameters from intent firstFragment.setArguments(getIntent().getExtras()); // In case of using the android support library we must use the getSupportFragmentManager() method, // otherwise we use getFragmentManager() method. // The third parameter is an arbitrary TAG assigned to Fragment. We need to do that for being able // to find the corresponding fragment afterwards getSupportFragmentManager().beginTransaction() .add(R.id.fgmContainer, firstFragment, SxFragment.class.getName()).commit(); } } |
3) Fragment A (items list)
Nel fragment di sinistra, contenente la listView, assegnamo all’evento di selezione (OnItemClick) il compito di notificare la selezione tramite un metodo di callback (onItemSelected) all’attività principale.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 |
public class SxFragment extends Fragment ... MainActivity parent; // Having the container activity can be useful to passing messages and parameters List<Item> items; // Objects in listView ... @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { super.onCreate(savedInstanceState); View view = inflater.inflate(R.layout.my_list_layout, container, false); parent = (MainActivity) getActivity(); // Get out listView and set onItemListClick listener in order to update the detail Fragment B myList = (ListView) view.findViewById(R.id.myList); myList.setOnItemClickListener(new OnItemClickListener() { @Override public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) { try { // We can create an interface for calling activities (MainActivity) in order to // be sure to find the expected update method OnItemListSelectedListener callback = (OnItemListSelectedListener)a; Item c = items.get(arg2); // Pass new item selected to MainActivity callback.onItemSelected(c); } catch (ClassCastException e) { throw new ClassCastException(a.toString() + " must implement OnItemListSelectedListener"); } } }); … // MainActivity must implement this interface public interface OnItemListSelectedListener { public void onItemSelected(Contatto c); } } |
4) Activity principale
Aggiungo il metodo di selezione nella MainActivity. Chiaramente il metodo discrimina il caso in cui abbiamo entrambi i fragment da quello in cui occorra istanziare il secondo dinamicamente. Nel primo caso è sufficiente richiamare il metodo di update esposto dal fragment (doItemSelection), mentre nel secondo caso occorre effettuare una transizione dinamica tra i due Fragment. Il primo dei due, viene sostituito tramite “replace”, ma inserito nel Back Stack in modo che premendo il pulsante “Back” non termini l’activity ma venga semplicemente effettuata la transizione al contario e riappaia il primo Fragment.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
public class MainActivity extends FragmentActivity implements SxFragment.OnItemListSelectedListener ... Item selectedItem; ... @Override public void onItemSelected(Item item) { // The user selected the headline of an article from the HeadlinesFragment // We verify if large screen layout is used or not by checking the presence // of the detail Fragment DxFragment itemDetailFrag = (DxFragment) getSupportFragmentManager().findFragmentById(R.id.fgmDetail); // It's better to maintain shared information in the MainActivity. // In this case we keep the item selected in the selectedItem class variable selectedItem = item; if (itemDetailFrag != null) { // if detail fragment exists we simple need to update it itemDetailFrag.doItemSelection(selectedItem.getId().toString()); } else { // Otherwise, swap fragments DxFragment newFragment = new DxFragment(); // Pass the necessary parameters (in this case the selectedItem) Bundle args = new Bundle(); args.putString(DxFragment.KEY_ITEM_SELECTED, selectedItem.getId().toString()); newFragment.setArguments(args); // Create transaction FragmentTransaction transaction = getSupportFragmentManager().beginTransaction(); // Replace the fragment and specify the transaction mode //note the arbitrary TAG passed in order to find the fragment afterwards //ID is not fixed because we are creating the fragment at runtime transaction.replace(R.id.fgmContainer, newFragment, DxFragment.class.getName()); transaction.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE); //add the transaction to the back stack so the user can navigate back transaction.addToBackStack(null); // Commit the transaction transaction.commit(); } } } |
5) Fragment B (item details)
Il Fragment B, infine, riceve come argomenti i parametri necessari alla sua inizializzazione o, se già inizializzato, espone i metodi necessari all’aggiornamento da parte della MainActivity. Nell’esempio semplicemente l’id dell’item selezionato viene inserito in una TextView.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
public class DxFragment extends Fragment { public static String KEY_ITEM_SELECTED = "selectedItemKey"; ... TextView itemIdTxt; String id; MainActivity parent; ... @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { view = inflater.inflate(R.layout.my_detail_layout, container, false); parent = (MainActivity) getActivity(); // Get textView from layout in order to show selected item's id itemIdTxt = (TextView)view.findViewById(R.id.itemIdTxt); // Get arguments containing the ID of selected item if(getArguments() != null) id = getArguments().getString(KEY_ITEM_SELECTED); //initialize the item doItemSelection(id); return view; } //update method public void doItemSelection(String id) { this.id = id; itemIdTxt.setText(id); } } |
Nei prossimi articoli vedremo come effettuare la gestione di Menu e Actionbar nel caso di utilizzo dei Fragment.
Ciao e a presto
Federico
JQuery e Prototype
Mi è capitato ultimamente di dover utilizzare contemporaneamente due fra le più importanti librerie Javascript
all’interno dello stesso progetto: parlo della libreria JQuery e Prototype.
Nel fare questo però ho incontrato non poche difficoltà a motivo del fatto che entrambe le librerie dichiarano la stessa
variabile “$”.
Per questo motivo tutto ciò che veniva referenziato attraverso la variabile $ come ad esempio:
|
1 |
$('nome oggetto').value |
generava un errore di undefined variabile “$” impedendo di fatto al codice javascript di funzionare correttamente.
Per ovviare a questo problema ho trovato una soluzione utilizzando una funzione JQuery con la quale è possibile ridefinire
la variabile “$” con un altro nome:
|
1 |
var Qr = jQuery.noConflict(); |
Dopo aver ridefinito la variabile, questa potrà essere utilizzata in ogni riferimento a funzione JQuery come nell’esempio seguente:
|
1 |
Qr(document).ready |
Grazie a questo piccolo accorgimento le due librerie non interferiscono più fra di loro e tutto torna a funzionare correttamente.
Alla prossima
Symfony 2 – Cosa c’è di nuovo? (Parte 1)
Con questo articolo vorrei cominciare una serie di considerazioni sull’evoluzione di uno dei più famosi framework PHP attualmente utilizzato: SYMFONY.
Per chi non lo conoscesse, Symfony è un framework PHP, estremamente utile alla realizzazione di web application PHP che necessitano di una struttura di progetto ben definita e di una serie di strumenti di sviluppo che altrimenti il linguaggio in se non metterebbe a disposizione.
Per questo motivo Symfony aggrega una serie di concetti che di fatto facilitano e velocizzano lo sviluppo di applicazioni rendendole nello stesso tempo robuste e facilmente manutenibili.
Concetti quali:
- MVC
- ORM
- AJAX
- Components
- Bundles
Dalla 1 alla 2 – STRUTTURA FOLDER
Tutti coloro che, ad oggi, sono abituati alla versione 1, si troveranno di fronte ad una notevole ristrutturazione del framework che, sfruttando le nuove caratteristiche della versione 5.3 di PHP, ha fatto un notevole passo avanti verso la filosofia JAVA.
Symfony 2 organizza il progetto con una struttura di folder molto diversa rispetto alla versione 1. Un esempio possiamo trovarlo di seguito:
APP Folder
La cartella APP rappresenta l’applicazione che con Symfony 2 diventa unica.
Con Symfony 1 era possibile creare più applicazioni in un progetto, ad esempio “Frontend” e “Backend” e tutto il codice di gestione delle action veniva suddiviso in moduli all’interno della APP folder.
Con Symfony 1 il codice PHP non è più presente in questa cartella, ma la APP folder contiene tutti gli oggetti di base dell’applicazione come ad esempio i file di configurazione, i log, la cache e i template.
SRC Folder
La SRC Folder contiene tutto il codice di gestione dell’applicazione. Il codice con Symfony 2 vive all’interno dei Bundle paragonabili ai Plugin nella versione 1 di Symfony.
I Bundle possono essere paragonati ai Package in Java e rappresentano delle sotto folder all’interno della SRC Folder.
Symfony 2 è in grado di implementare una struttura a Bundle grazie all’introduzione del concetto di “name spacing” implementato nella versione 5.3 di PHP.
Nei prossimi articoli approfondiremo l’argomento Bundle.
VENDOR Folder
La VENDOR Folder accoglie tutte le librerie che rappresentano il CORE del framework e tutte le librerie dei vari PLUGIN utilizzati da Symfony 2 come ad esempio Doctrine, Swiftmailer e Twig
WEB Folder
La WEB Folder non cambia molto rispetto alla versione 1. La differenza più significativa sta nel fatto tutte le risorse web quali (Javascript, immagini e CSS) vengono organizzate in bundle come nel caso del codice.
Formazione in iFaber
Ciao a tutti!
Un breve articolo per documentare l’attività che con Ivan stiamo svolgendo da consulenti in iFaber.
Il progetto, nato in collaborazione con Elever srl ormai un anno fa, è finalizzato alla realizzazione di una portale web per la gestione e qualifica dei fornitori. Il portale è destinato sia ad uso interno (Unicredit) che per clienti terzi.
Il binomio tecnologico impiegato Zkoss+Oracle si è dimostrato all’avanguardia ed una scelta decisamente azzeccata (tempi di sviluppo brevissimi ma con affidabilità e prestazioni ottime). Altre tecnologie (come Hibernate e Axis) hanno fatto da corollario per la nascita di una web application veramente di grande spessore sia dal punto di vista funzionale che di concezione!
Presto saranno disponibili maggiori dettagli su questa e sulle altre attività di collaborazione nella sezione dedicata.
Questa settimana abbiamo tenuto, presso iFaber, un corso sull’applicazione dedicato prima di tutto ad introdurre nuove risorse (circa una dozzina), destinate ad ingrandire il team di sviluppo, alle tecnologie impiegate (in particolare Zkoss).
Il corso si è indirizzato poi a dare una panoramica delle caratteristiche peculiari dell’applicazione (tra cui dinamicità, configurabilità, internazionalizzazione, profilazione degli accessi…) scendendo nei dettagli tecnici implementativi necessari ad un primo contatto con il “dietro le quinte” di questo complesso portale.
Naturalmente ci siamo contraddistinti per il nostro stile ultra professionale (…) anche in questa circostanza!
Ecco qualche contributo dell’evento 🙂
Ciao a tutti e “stay tuned!”
 |
 |
I.B.M. one hundred years of story
This year is the century anniversy of I.B.M. , i found this promo-story on the net , yes is a promo but i think is so interesting :
