Saat aplikasi terinstall maka aplikasi akan meminta data pada server di
www.legendstory.hol.es/story.db . Web server akan memberikan data berupa array
seperti berikut :
Listing Program
<?php
$conn = new mysqli('mysql.idhostinger.com', 'u785993769_amel', 'coding','u785993769_story');
//$conn = mysql_connect( 'mysql.idhostinger.com', 'u785993769_amel', 'coding' ) or die ( "connection failure" );
//mysql_select_db ( 'u785993769_story' ); $table_name = 'legenda'; @$txtcari=$_GET['txtcari']; if(isset($txtcari)) { @$txtcari=$_GET['txtcari']; $query = "select
id,title,images,address,body_ind,body_eng,latitude,longitude from legenda where id='".$_GET['txtcari']."' or title LIKE '%".$_GET['txtcari']."%'"; } else { $query = 'select id,title,images,address,body_ind,body_eng,latitude,longitude from `legenda`'; } $result = $conn->prepare($query); $result->execute(); $response = array(); $array = array();
if ($result instanceof mysqli_stmt) { $result->store_result();
$variables = array(); $data = array();
$meta = $result->result_metadata(); while ($field = $meta->fetch_field()) {
$variables[] = &$data[$field->name]; // pass by reference }
call_user_func_array(array($result, 'bind_result'), $variables); $i = 0; while ($result->fetch()) { $array[$i] = array(); foreach ($data as $k => $v) { $array[$i][$k] = utf8_encode($v); } $i++; }
while ($row = $result->fetch_assoc()) { $array[] = utf8_encode($row); } } if($array == NULL){ $response['error'] = true; } else { $response['error'] = false; } $response['data'] = $array; echo json_encode ( $response );
4.2.2 Splash Screen
Saat pertama membuka aplikasi , maka akan muncul splashscreen . bersamaan dengan muncul splashscreen sistem akan mengambil data pada phpMyAdmin dan dipindahkan pada database lokal
Listing Program :
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);// Settings.load(this);
Displays.load(this);
setContentView(R.layout.activity_main); if (savedInstanceState == null) {
getSupportFragmentManager().beginTransaction() .add(R.id.container, new
SplashFragment()).commit();
stack = Stack.SPLASH; }
}
public void startApp(List<StoryBean> data) {
if (data == null || data.isEmpty())
return;
this.data = data;
if (stack != Stack.MAIN) startMain(); }
protected void onPostExecute(Response result) {
// TODO Auto-generated method stub
super.onPostExecute(result);
if (result != null && result.data != null && !result.data.isEmpty()) {
if (!DatabaseAdapter.anyDbExist(context)) { DatabaseAdapter.addWisatas(context, result.data);
} else {
List<StoryBean> data = DatabaseAdapter .getAllWisata(context); List<StoryBean> update = new
ArrayList<StoryBean>();
for (int w = 0; w < result.data.size(); w++) {
if (result.data == null || result.data.isEmpty())
break;
if (w < 0) w = 0;
e++) {
if (result.data.get(w).compareTo(data.get(e)) == 2) {
update.add(result.data.get(w)); result.data.remove(w);
w -= 1;
data.remove(e);
break;
} if (result.data.get(w).compareTo(data.get(e)) == 1) {
result.data.remove(w);
w -= 1; data.remove(e); break; } } } if (!update.isEmpty()) DatabaseAdapter.updateWisatas(context, update);
if (!data.isEmpty()) DatabaseAdapter.deleteWisatas(context, data);
if (!result.data.isEmpty()) DatabaseAdapter.addWisatas(context, result.data);
}
((MainActivity)
context).startApp(DatabaseAdapter
.getAllWisata(context));
} else if (!DatabaseAdapter.anyDbExist(context)) { prepare();
} }
}
4.2.3 MenuUtama
Pada menu utama berisi fitur-fitur utama aplikasi. Beberapa fitur utama tersebut yaitu: Story , Nearby , Favorite , Help dan About Menu Utama memuat tombol menu
yang dapat digunakan dalam aplikasi. Setiap menu memiliki aksi yang berbeda sesuai nama menu dan fungsinya.
Gambar 4.4 Menu Utama Listing Program :
public void startMain() {
getSupportFragmentManager().beginTransaction() .replace(R.id.container, new MainFragment()).commit();
stack = Stack.MAIN;}
public void onClick(View v) {
// TODO Auto-generated method stub
final int id = v.getId();
if (id == R.id.btn_setting) {
new SettingDialog(this).show(getActivity()
.getSupportFragmentManager(), null); } else if (id == R.id.btn_story) {
((MainActivity) getActivity()).showList(false); } else if (id == R.id.btn_fav) {
((MainActivity) getActivity()).showList(true); } else if(id == R.id.btn_nearby) {
((MainActivity)getActivity()).showMap(null); }else if(id == R.id.btn_help) {
((MainActivity) getActivity()).ShowHelp(v); }else if (id == R.id.btn_about) {
((MainActivity) getActivity()).ShowAbout(v);}}
4.2.4 Daftar Story
Merupakan menu yang menampilkan list halaman daftar Story, pengguna dapat memilih
story mana yang ingin dilihat.
Gambar 4.5 Daftar Story
Listing program :
public void showList(boolean showOnlyFav) {
ListFragment fragment = new ListFragment(); if (!showOnlyFav) {
fragment.setData(data,
Settings.LANG == Settings.BAHASA_INDONESIA
? "Cerita"
: "Story");
stackTwo = Stack.LIST; } else {
List<StoryBean> nData = new ArrayList<StoryBean>(); for (StoryBean s : data)
if (s.isFavorite()) nData.add(s);
for (int w = 0; w < nData.size(); w++)
for (int e = w + 1; e < nData.size(); e++) { if (nData.get(w).getTime() > nData.get(e).getTime()) { StoryBean s = nData.get(w); nData.set(w, nData.get(e)); nData.set(e, s); } } fragment.setData(nData,
Settings.LANG == Settings.BAHASA_INDONESIA
? "Cerita"
: "Story");
stackTwo = Stack.LIST_FAV; }
getSupportFragmentManager().beginTransaction()
.replace(R.id.container, fragment).commit();
stack = Stack.LIST; }
listview.setOnItemClickListener(new OnItemClickListener() { @Override
public void onItemClick(AdapterView<?> parent, View
view,
int position, long id) {
// TODO Auto-generated method stub
((MainActivity)getActivity()).showContent((StoryBean) listview.getAdapter().getItem(position)); }});
4.2.5 Detail Story
Gambar 4.6 Detail Story
Listing program :
public void showContent(StoryBean data) {
ContentFragment fragment = new ContentFragment(); fragment.setData(data);
getSupportFragmentManager().beginTransaction()
.replace(R.id.container, fragment).commit();
stack = Stack.CONTENT; }
public View onCreateView(LayoutInflater inflater, ViewGroup
container,
Bundle savedInstanceState) {
// TODO Auto-generated method stub
View root = inflater.inflate(R.layout.fragment_content, container,
false);
img = (ImageView) root.findViewById(R.id.img_wisata); PicassoTarget target = new PicassoTarget(getActivity(), Api.SERVER_URI
+ Api.IMAGES_URI + data.getImages(), img, Displays.width,
Displays.height / 3, ImageType.LARGE); root.setTag(target);
Picasso.with(getActivity())
.load(Api.SERVER_URI + Api.IMAGES_URI +
data.getImages())
.into(target);
((TextView) root.findViewById(R.id.text_judul)) .setText(data.getTitle());
((TextView)
root.findViewById(R.id.text_alamat)).setText(data
.getAddress());
((TextView) root.findViewById(R.id.text_body)) .setText(Settings.LANG ==
Settings.BAHASA_INDONESIA ? Html
.fromHtml(data.getBody_ind()) : Html.fromHtml(data
.getBody_eng()));
root.findViewById(R.id.btn_home).setOnClickListener(this); root.findViewById(R.id.btn_fav).setOnClickListener(this); root.findViewById(R.id.btn_map).setOnClickListener(this);
root.findViewById(R.id.btn_share).setOnClickListener(this);
fav = (ImageButton) root.findViewById(R.id.btn_fav);
fav.setImageResource(data.isFavorite() ? R.drawable.ic_star_grey600_24dp
: R.drawable.ic_star_outline_grey600_24dp);
return root;
}
4.2.6 Lokasi Wisata
Menu ini berada pada detail story , menu ini akan berjalan saat user menekan tombol maps yang berada pada bagian bawah tengah menu detail story . saat dijalankan akan menampilkan lokasi wisata .
Gambar 4.7 Lokasi Wisata
Listing program
else if (id == R.id.btn_map) {
((MainActivity) getActivity()).showMap(data);
4.2.7 Share Cerita
Menu ini berada pada detail story , menu ini akan berjalan saat user menekan tombol share yang berada pada kanan bawah menu detail story. Menu ini digunakan untuk
Gambar 4.8 Share Cerita Listing program :
else if (id == R.id.btn_share) {
if (bmp == null)
bmp = drawableToBitmap(img.getDrawable());
if (file == null) {
file = new
File(Environment.getExternalStoragePublicDirectory( Environment.DIRECTORY_DCIM).toString()
+ "/" + data.getImages()); if (file.exists())
try {
file.delete();
} catch (Exception e) {
// TODO: handle exception
}
FileOutputStream out = null;
try {
out = new FileOutputStream(file);
bmp.compress(Bitmap.CompressFormat.JPEG, 100, out);
} catch (Exception e) {
e.printStackTrace();
} finally {
try {
out.close(); } } catch (IOException e) { e.printStackTrace(); } } }
Intent sharingIntent = new Intent(Intent.ACTION_SEND);
sharingIntent.setType("text/plain"); Uri screenshotUri =
Uri.parse(file.getAbsolutePath());
sharingIntent.setType("image/*"); sharingIntent.putExtra(Intent.EXTRA_STREAM, screenshotUri); sharingIntent .putExtra( Intent.EXTRA_TEXT, data.getTitle() + (Settings.LANG == Settings.BAHASA_INDONESIA ? ", Dibagikan oleh "
: ", Shared by ") + getActivity() .getString(R.string.app_name) + " " + SHARE_LINK); startActivity(Intent .createChooser( sharingIntent, Settings.LANG == Settings.BAHASA_INDONESIA ? " Membagikan dengan "
: " Share with "));
} }
4.2.8 Favorite Wisata
Menu ini digunakan untuk memfavoritkan cerita yang diinginkan . cara untuk memfavoritkan cerita adalah dengan menekan tombol bintang jika ditekan akan berubah warna yang artinya cerita sudah berada pada halaman favorite .
Gambar 4.9 Favorite Cerita Listing Program :
public void setFav(StoryBean story) {
for (int w = 0; w < data.size(); w++)
if (data.get(w).getId() == story.getId()) {
data.set(w, story);
DatabaseAdapter.updateWisata(getApplicationContext(), story);
break;
} }
4.2.9 Search Story
Meni ini ada pada halaman daftar story di bagian kanan atas bar , menu search story digunakan untuk mencari cerita yang diinginkan berdasarkan judul dan isi cerita .
Gambar 4.10 Search Cerita
Listing program :
final EditText search = (EditText) root
.findViewById(R.id.editText_search); search.setHint(title);
search.addTextChangedListener(new TextWatcher() { @Override
public void onTextChanged(CharSequence s, int
start, int before,
int count) {
// TODO Auto-generated method stub
adapter.getFilter().filter(s.toString()); }
4.2.10 Nearby
Menu ini adalah untuk menampilkan semua lokasi yang ada pada database dan lokasi terdekat dari tempat user berada.
Gambar 4.11 Nearby
Listing program :
public void showMap(StoryBean data) {
if (mapsFragment == null)
mapsFragment = new MapsFragment(); if (data != null) {
mapsFragment.setData(data); } else {
mapsFragment.setDatas(this.data);
stackTwo = Stack.NEARBY; }
getSupportFragmentManager().beginTransaction() .replace(R.id.container,
mapsFragment).commit();
stack = Stack.MAP; }
// TODO Auto-generated method stub if (this.location == null) {
this.location = location; goToPositon(location, null);
if (directionManager == null || data == null)
return; directionManager.clear(); directionManager .build(new LatLng(location.getLatitude(), location .getLongitude()), new LatLng(data.getLatitude(),
data.getLongitude()),
mode);
return;
}
lastLocation = this.location; this.location = location;
double distance =
DirectionManager.getDistance(lastLocation, location); Log.i("", "onSingleView " + onSingleView); if (circle == null && !onSingleView) {
Log.w("", "circle");
int strokeColor = 0xffff0000; // red outline int shadeColor = 0x44ff0000; // opaque red fill CircleOptions circleOptions = new CircleOptions()
.center(new LatLng(location.getLatitude(), location
.getLongitude())).radius(RADIUS)
.fillColor(shadeColor).strokeColor(strokeColor) .strokeWidth(8);
circle = googleMap.addCircle(circleOptions); } if (distance > 0.005d) { if (circle != null) { circle.remove(); circle = null; } if (!onSingleView) {
int strokeColor = 0xffff0000; // red outline int shadeColor = 0x44ff0000; // opaque red fill
CircleOptions circleOptions = new CircleOptions()
.center(new LatLng(location.getLatitude(), location
.fillColor(shadeColor).strokeColor(strokeColor) .strokeWidth(8);
circle = googleMap.addCircle(circleOptions); } } if (directionManager == null) return; if (directionManager.isRunning()) { goToPositon(location,
DirectionManager.getBearing(new LatLng(
location.getLatitude(), location.getLongitude()),
directionManager.getSectionPoint())); }
if (distance > 0.005d && directionManager.isRunning()) {
directionManager.setPointToSection(location); } if (!directionManager.isRunning()) goToPositon(location, null); } 4.2.11 Mode Maps
Mode maps digunakan untuk memberikan pilihan tampilan untuk menampilkan lokasi wisata
Gambar 4.12 Mode Maps Listing program :
public void setDirectionMode(int mode) {
// TODO Auto-generated method stub
menu.onDetachedFromWindow();
if (directionManager == null || data == null)
return;
directionManager.clear(); if (location != null)
directionManager
.build(new LatLng(location.getLatitude(),
location
.getLongitude()), new LatLng(data.getLatitude(),
data.getLongitude()), mode); this.mode = mode;
switch (mode) {
case GoogleDirection.MODE_DRIVING:
text_mode.setText("Driving");
break;
case GoogleDirection.MODE_BICYCLING:
text_mode.setText("Bicycling");
break;
text_mode.setText("Walking"); break; default: break; } } 4.2.12 Help
Menu ini berisi tentang keterangan tombol-tombol yang digunakan dalam aplikasi .
Gambar 4.13 Help Listing program :
public void ShowHelp(View v) {
startActivity(new Intent(getApplicationContext(), Help.class));
}
4.2.13 About
Gambar 4.14 About Listing program :
public void ShowAbout(View v) {
startActivity(new Intent(getApplicationContext(), About.class));
}
4.2.14 Pilih Bahasa
Menu ini untuk digunakan untuk memilih bahasa yang akan digunakan
Listing program :
public void onClick(View v) {
// TODO Auto-generated method stub
if (v.getId() == R.id.btn_ok) { if (rb1.isChecked())
Settings.LANG = Settings.BAHASA_INDONESIA; else
Settings.LANG = Settings.ENGLISH; Settings.save(getActivity());
callback.refreshState(); dismiss(); } else { rb1.setChecked(false); rb2.setChecked(false); if (v == rb1) rb1.setChecked(true); else if (v == rb2) rb2.setChecked(true); }
public class Settings {
public static final int BAHASA_INDONESIA = 11;
public static final int ENGLISH = 22;
public static int LANG = BAHASA_INDONESIA;
private static final String KEY = Settings.class.getSimpleName() +
"KEYS";
public static void load(Context context) {
SharedPreferences sp = context.getSharedPreferences(KEY, Context.MODE_PRIVATE);
LANG = sp.getInt(KEY, BAHASA_INDONESIA); }
public static void save(Context context) {
SharedPreferences sp = context.getSharedPreferences(KEY, Context.MODE_PRIVATE);
sp.edit().putInt(KEY, LANG).apply(); }
99
BAB V
ANALISA HASIL
Dalam bab ini dibahas mengenai pengujian program dengan menggunakan metode black box. Untuk menguji fungsional program dan kuesioner yang bertujuan untuk mengetahui respon user terhadap sistem yang dibuat.