Mengganti Tema IDE Arduino

From Indonesian Research And Development Center
Jump to: navigation, search

Pendahuluan

Tutorial singkat kali ini akan membahas mengenai cara mengubah tampilan tema IDE arduino. Adapun IDE arduino yang digunakan pada tutorial ini adalah versi 1.6.6.


Langkah-langkah

  • Tutup dahulu IDE arduino jika sedang aktif.
  • Unduh tampilan yang diinginkan, misalnya tema Wu Arduino:
% wget -q http://hellowoo.com/wp-content/uploads/2012/10/wu-arduino-theme.zip
  • Ekstrak paket yang telah diunduh tadi ke sub direktori baru bernama themes:
% unzip wu-arduino-theme.zip -d themes
  • Pindah ke sub direktori yang baru tersebut:
% cd themes
  • Selanjutnya Anda dapat menghapus sub direktori __MACOSX pada sub direktori tersebut karena tidak dibutuhkan:
% rm -r __MACOSX
  • Ada beberapa bagian yang perlu Anda ubah pada berkas theme.txt agar sesuai dengan konfigurasi tema yang digunakan pada arduino versi 1.6.6. Berikut ini adalah isi berkas theme.txt yang sudah disesuaikan untuk IDE arduino 1.6.6:
# GUI - STATUS
status.notice.fgcolor = #2f313d
status.notice.bgcolor = #131313
status.error.fgcolor = #ffffff
status.error.bgcolor = #131313
status.edit.fgcolor = #2f313d
status.edit.bgcolor = #131313
status.font = Monaco,plain,12

# GUI - TABS
# settings for the tabs at the top
# (tab images are stored in the lib/theme folder)
header.bgcolor = #131313
header.text.selected.color = #2f2f2f
header.text.unselected.color = #3f3f3f
header.text.font = Helvetica,plain,12

# GUI - CONSOLE
console.font = Monospaced,plain,11
console.font.macosx = Monaco,plain,10
console.color = #131313
console.output.color = #757575
console.error.color = #002e43

# GUI - BUTTONS
buttons.bgcolor = #131313
buttons.status.font = Helvetica,plain,11
buttons.status.color = #434343

# GUI - LINESTATUS
linestatus.color = #ffffff
linestatus.bgcolor = #131313

# EDITOR - DETAILS

# foreground and background colors
editor.fgcolor = #ced0bb
editor.bgcolor = #131313

# highlight for the current line
editor.linehighlight.color=#1a1d21
# highlight for the current line
editor.linehighlight=true

# caret blinking and caret color
editor.caret.color = #7cecec

# color to be used for background when 'external editor' enabled
editor.external.bgcolor = #c8d2dc

# selection color
editor.selection.color = #23262c

# area that's not in use by the text (replaced with tildes)
editor.invalid.style = #7e7e7e,bold

# little pooties at the end of lines that show where they finish
editor.eolmarkers = false
editor.eolmarkers.color = #999999

# bracket/brace highlighting
editor.brackethighlight = true
editor.brackethighlight.color = #7cecec


# TEXT - KEYWORDS

# FUNCTIONS e.g abstract, final, private
editor.keyword1.style = #4e4e4e,plain
editor.data_type.style = #4e4e4e,plain

# METHODS e.g. beginShape, point, line, called functions
editor.keyword2.style = #6cc9e6,plain
editor.function.style = #6cc9e6,plain

# STRUCTURES e.g. byte, char, short, color - functions (pinkish)
editor.keyword3.style = #f20b52,bold
editor.reserved_word.style = #f20b52,bold


# TEXT - LITERALS

# constants: e.g. null, true, this, RGB, TWO_PI, quoted text
editor.literal1.style = #b1aa77,plain

# p5 built in variables: e.g. mouseX, width, pixels
editor.literal2.style = #473f51,plain
editor.variable.style = #473f51,plain
editor.reserved_word_2.style = #473f51,plain
editor.literal_boolean.style = #473f51,plain
editor.literal_char.style = #473f51,plain
editor.literal_string_double_quote.style = #473f51,plain
editor.preprocessor.style = #f20b52,plain

# http://www.arduino.cc/
editor.url.style = #0000ff,underlined

# e.g. + - = /
editor.operator.style = #5c5c5c,plain

# ?? maybe this is for words followed by a colon
# like in case statements or goto
editor.label.style = #7e7e7e,bold


# TEXT - COMMENTS
editor.comment1.style = #333333,plain
editor.comment2.style = #333333,plain


# LINE STATUS - editor line number status bar at the bottom of the screen
linestatus.font    = Helvetica,plain,10
linestatus.height  = 20
  • Setelah mengubah isi dari berkas theme.txt tersebut, lanjutkan dengan menyalin atau memindahkan seluruh berkas hasil ekstraksi ke sub direktori themes pada direktori instalasi arduino. Misalnya jika direktori instalasi arduino berada pada ~/arduino-1.6.6 maka Anda menyalin berkas tema yang baru ke sub direktori ~/arduino-1.6.6/lib/theme/. Caranya seperti ini:
% cp * ~/arduino-1.6.6/lib/theme/
  • Jika Anda menggunakan sistem operasi Microsoft Windows, maka direktori theme akan berada pada direktori \Program Files\Arduino\lib\theme\.


Penutup

Selain menggunakan tampilan yang ada pada tutorial ini, Anda juga dapat menggunakan tampilan sesuai dengan yang Anda inginkan. Sekian tutorial singkat kali ini, semoga bermanfaat. Terima kasih kepada Tuhan Yang Maha Esa, Maxindo, N3 dan Anda yang telah membaca tutorial ini.


Referensi