Triangular tesselations
This allows you to make a mosaic by choosing a colour, then clicking in a large grid. The tiles are triangular. Gridview demands rectangular views, so three grids are layered on top of each other. To make a triangle, it fills in the various bits on the different levels leaving the rest transparent, to allow different colours next to each other.
app/manifests/AndroidManifest.xml - to force landscape orientation
<![CDATA[
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.edkins.shapes" >
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme" >
<activity android:name=".MainActivity" android:screenOrientation="portrait">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
]]>
app/res/drawable - pictures
There are a number of colour files, called "tessera0", "tessera1", "tessera2" etc. They are referenced in app/java/com.(the project name)/ImageTessera and the number of them (10) is referenced in app/res/layout/activity_main.xml.
app/res/mipmap/ic_launcher.png/ - icon for launching app
app/res/values/strings.xml - strings
<![CDATA[
<resources>
<string name="app_name">Triangle tessellations</string>
<string name="howToText">Tap on colour, then in middle of triangle</string>
<string name="newText">New</string>
</resources>
]]>
app/res/layout/activity_main.xml - screen format
<![CDATA[
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/screenView"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<GridView
android:id="@+id/paletteView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
android:numColumns="10"
/>
<TextView
android:id="@+id/howTo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
android:text="@string/howToText"
android:layout_below="@id/paletteView"
/>
<Button
android:id="@+id/newButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/newText"
android:onClick="doClear"
android:layout_below="@id/paletteView"
android:layout_alignBaseline="@id/howTo"
android:layout_toRightOf="@id/howTo"
android:layout_toEndOf="@id/howTo"
/>
<GridView
android:id="@+id/grid0View"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/howTo"
/>
<GridView
android:id="@+id/grid1View"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/howTo"
/>
<GridView
android:id="@+id/grid2View"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/howTo"
/>
</RelativeLayout>
]]>
app/java/com.(the project name)/MainActivity - main code for app
<![CDATA[
package com.edkins.shapes;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
public class MainActivity extends AppCompatActivity {
public static int width = 16;
public static int height = 10;
public static int colNum = 1;
public static int [] [] tile = new int [width] [width];
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
GridView paletteV = (GridView) findViewById(R.id.paletteView);
paletteV.setAdapter(new ImagePalette(this));
paletteV.setOnItemClickListener(new AdapterView.OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View v,
int position, long id) {
processPaletteClick(position);
}
});
GridView grid0V = (GridView) findViewById(R.id.grid0View);
grid0V.setNumColumns(width);
grid0V.setAdapter(new ImageGrid0(this));
GridView grid1V = (GridView) findViewById(R.id.grid1View);
grid1V.setNumColumns(width);
grid1V.setAdapter(new ImageGrid1(this));
GridView grid2V = (GridView) findViewById(R.id.grid2View);
grid2V.setNumColumns(width);
grid2V.setAdapter(new ImageGrid2(this));
grid2V.setOnItemClickListener(new AdapterView.OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View v,
int position, long id) {
processGridClick(position);
}
});
}
public void processPaletteClick(int position) {
if (position<1 || position>8) {return;}
colNum = position - 1;
}
public void processGridClick(int position) {
int x = position % width;
int y = position / width;
if (tile [y] [x]==colNum) {tile [y] [x] = 0;}
else {tile [y] [x] = colNum;}
redo();
}
public void redo() {
GridView grid0V = (GridView) findViewById(R.id.grid0View);
grid0V.setAdapter(new ImageGrid0(this));
GridView grid1V = (GridView) findViewById(R.id.grid1View);
grid1V.setAdapter(new ImageGrid1(this));
GridView grid2V = (GridView) findViewById(R.id.grid2View);
grid2V.setAdapter(new ImageGrid2(this));
}
public void doClear(View view) {
for (int y=0; y<height;y++) {for (int x=0; x<width;x++) {tile [y] [x] = 0;}}
redo();
}
}
]]>
app/java/com.(the project name)/ImagePalette - code for palette gridview. You create this new file by right-clicking on the MainActvity and select New, then Java class
<![CDATA[
package com.edkins.shapes;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
public class ImagePalette extends BaseAdapter {
private AppCompatActivity mContext;
public ImagePalette(AppCompatActivity c) {mContext = c;}
public int getCount() {return 10;}
public Object getItem(int position) {return null;}
public long getItemId(int position) {return 0;}
// create new ImageView for palette
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
imageView = new ImageView(mContext);
GridView grid = (GridView) mContext.findViewById(R.id.paletteView);
int w = grid.getWidth() / 10;
imageView.setLayoutParams(new GridView.LayoutParams(w, w));
}
else {
imageView = (ImageView) convertView;
}
// initialise the view element (to one of the colours)
imageView.setImageResource(palette[position]);
return imageView;
}
// Colours
public static Integer[] palette = {
R.drawable.space, R.drawable.palette0,
R.drawable.palette1, R.drawable.palette2,
R.drawable.palette3, R.drawable.palette4, R.drawable.palette5,
R.drawable.palette6, R.drawable.palette7, R.drawable.space
};
}
]]>
app/java/com.(the project name)/ImageGrid0 - code for first grid gridview - a new file, see above
<![CDATA[
package com.edkins.shapes;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.Toast;
public class ImageGrid0 extends BaseAdapter {
private AppCompatActivity mContext;
public ImageGrid0(AppCompatActivity c) {mContext = c;}
public int getCount() {return MainActivity.width * MainActivity.height;}
public Object getItem(int position) {return null;}
public long getItemId(int position) {return 0;}
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
imageView = new ImageView(mContext);
RelativeLayout grid = (RelativeLayout) mContext.findViewById(R.id.screenView);
int w = grid.getWidth() / MainActivity.width;
imageView.setLayoutParams(new GridView.LayoutParams(w, (int) (w*1.74)));
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
}
else {
imageView = (ImageView) convertView;
}
int x = position % MainActivity.width;
int y = position / MainActivity.width;
int tileContent = MainActivity.tile[y][x];
int pic;
if ((x+y)%2==0) {pic = colourup[tileContent];}
else {pic = colourdown[tileContent];}
imageView.setImageResource(pic);
return imageView;
}
public static Integer[] colourup = {
R.drawable.up, R.drawable.redup0, R.drawable.blueup0,
R.drawable.greenup0, R.drawable.yellowup0, R.drawable.cyanup0,
R.drawable.magentaup0, R.drawable.blackup0
};
public static Integer[] colourdown = {
R.drawable.down, R.drawable.reddown0, R.drawable.bluedown0,
R.drawable.greendown0, R.drawable.yellowdown0, R.drawable.cyandown0,
R.drawable.magentadown0, R.drawable.blackdown0
};
}
]]>
app/java/com.(the project name)/ImageGrid1 - code for second grid gridview - a new file, see above
<![CDATA[
package com.edkins.shapes;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.RelativeLayout;
public class ImageGrid1 extends BaseAdapter {
private AppCompatActivity mContext;
public ImageGrid1(AppCompatActivity c) {mContext = c;}
public int getCount() {return MainActivity.width * MainActivity.height;}
public Object getItem(int position) {return null;}
public long getItemId(int position) {return 0;}
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
imageView = new ImageView(mContext);
RelativeLayout grid = (RelativeLayout) mContext.findViewById(R.id.screenView);
int w = grid.getWidth() / MainActivity.width;
imageView.setLayoutParams(new GridView.LayoutParams(w, (int) (w*1.74)));
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
}
else {
imageView = (ImageView) convertView;
}
int x = (position % MainActivity.width) +1 ;
int y = position / MainActivity.width;
int tileContent = 0;
if (x < MainActivity.width) {tileContent = MainActivity.tile[y][x];}
int pic;
if ((x+y)%2==0) {pic = colourdown[tileContent];}
else {pic = colourup[tileContent];}
imageView.setImageResource(pic);
return imageView;
}
public static Integer[] colourup = {
R.drawable.up, R.drawable.redup1, R.drawable.blueup1,
R.drawable.greenup1, R.drawable.yellowup1, R.drawable.cyanup1,
R.drawable.magentaup1, R.drawable.blackup1
};
public static Integer[] colourdown = {
R.drawable.down, R.drawable.reddown1, R.drawable.bluedown1,
R.drawable.greendown1, R.drawable.yellowdown1, R.drawable.cyandown1,
R.drawable.magentadown1, R.drawable.blackdown1
};
}
]]>
app/java/com.(the project name)/ImageGrid2 - code for third grid gridview - a new file, see above
<![CDATA[
package com.edkins.shapes;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.RelativeLayout;
public class ImageGrid2 extends BaseAdapter {
private AppCompatActivity mContext;
public ImageGrid2(AppCompatActivity c) {mContext = c;}
public int getCount() {return MainActivity.width * MainActivity.height;}
public Object getItem(int position) {return null;}
public long getItemId(int position) {return 0;}
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
imageView = new ImageView(mContext);
RelativeLayout grid = (RelativeLayout) mContext.findViewById(R.id.screenView);
int w = grid.getWidth() / MainActivity.width;
imageView.setLayoutParams(new GridView.LayoutParams(w, (int) (w*1.74)));
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
}
else {
imageView = (ImageView) convertView;
}
int x = (position % MainActivity.width) - 1;
int y = position / MainActivity.width;
int tileContent = 0;
if (x >= 0) {tileContent = MainActivity.tile[y][x];}
int pic;
if ((x+y)%2==0) {pic = colourdown[tileContent];}
else {pic = colourup[tileContent];}
imageView.setImageResource(pic);
return imageView;
}
public static Integer[] colourup = {
R.drawable.up, R.drawable.redup2, R.drawable.blueup2,
R.drawable.greenup2, R.drawable.yellowup2, R.drawable.cyanup2,
R.drawable.magentaup2, R.drawable.blackup2
};
public static Integer[] colourdown = {
R.drawable.down, R.drawable.reddown2, R.drawable.bluedown2,
R.drawable.greendown2, R.drawable.yellowdown2, R.drawable.cyandown2,
R.drawable.magentadown2, R.drawable.blackdown2
};
}
]]>
Index to my other websites
© Jo Edkins 2016