极客工坊

 找回密码
 注册

QQ登录

只需一步,快速开始

查看: 67093|回复: 62

u8glib常用函数

  [复制链接]
发表于 2014-8-20 21:51:28 | 显示全部楼层 |阅读模式
本帖最后由 韋編弎絕 于 2016-5-30 22:56 编辑

    本教程的硬件环境为
        Arduino Nano (ATmega328p)
        0.96寸 OLED-128X64 SPI 接口

    其他屏幕与开发板未测试。各函数分类在不同楼层,可以在右上角的电梯直达到达楼层,也可以点击传送门到达
一楼  目录及介绍

    官方介绍为Universal Graphics Library for 8 Bit Embedded Systems。详见https://code.google.com/p/u8glib/wiki/userreference
    支持多种平台,Arduino,AVR,ARM。在Arduino中使用是非常方便与强大的。支持多种屏幕,比较常用的有OLED,LCD12864,LCD5110等。一些图片https://code.google.com/p/u8glib/wiki/gallery

github地址:https://github.com/olikraus/u8glib


    二楼  杂项 传送门
        > firstPage
        > nextPage

    三楼  几何图形 传送门
        > drawPixe                 点
        > drawLine                 线
        > drawHLine               水平线
        > drawVLine               垂直线
        > drawTriangle           三角(实心)
        > drawFrame              矩形框
        > drawRFrame            圆角矩形框
        > drawBox                 矩形(实心)
        > drawRBox               圆角矩形(实心)
        > drawCircle                圆
        > drawDisc                  圆形(实心)
        > drawEllipse               圆弧
        > drawFilledEllipse        扇形(实心)

    四楼  显示字符 传送门
        > drawStr          显示字符串
        > print               输出
  
    五楼  图像 传送门
        > drawBitmapP          画位图
        > drawXMBP              画大尺寸位图

    六楼  获取 传送门
        > getHeight          获得显示器高度
        > getWidth           获得显示器宽度
        > getStrWidth       获得字符串宽度

    七楼  设置 传送门
        > setFont                        设置字体
        > setPrintPos                   设置输出位置
        > setColorIndex               设置显示与否
        > setRot90 /180 /270      显示内容旋转
        > setFontPosTop      

    八楼  附录/补充 传送门
回复

使用道具 举报

 楼主| 发表于 2014-8-20 21:51:34 | 显示全部楼层
本帖最后由 韋編弎絕 于 2014-9-22 18:16 编辑

七楼  设置

  >  setFont
    1)方法定义
  1. U8GLIB::setFont(const u8g_fntpgm_uint8_t *font)
复制代码
   2)功能
         设置要显示字符的字体
    3)参数
         *font:字体样式。u8glib提供的字体样式https://code.google.com/p/u8glib/wiki/fontsize

  >  setPrintPos
    1)方法定义
  1. void U8GLIB::setPrintPos(u8g_uint_t x, u8g_uint_t y)
复制代码
   2)功能
         设置下文中print()的显示位置
    3)参数
         x:横坐标
         y:纵坐标

  >  setColorIndex
    1)方法定义
  1. void U8GLIB::setColorIndex(uint8_t color_index)
复制代码
   2)功能
         对于本文使用的单色OLED来说,此函数功能为是否显示对象。可以理解为透明还是不透明。对于有灰度值的屏幕则是一个灰度值。
    3)参数
         color_index:①1:表示显示,不透明②0:表示不显示,透明。
    4)例子
  1. U8GLIB u8g(...)
  2. ...
  3. u8g.setColorIndex(1);
  4. u8g.drawBox(10, 12, 20, 30);  
  5. u8g.setColorIndex(0);
  6. u8g.drawPixel(28, 14);          // clear pixel at (28, 14)
复制代码

setColorIndex

setColorIndex


  >  setRot90 or 180 or 270
    1)方法定义
  1. void U8GLIB::setRot90()
  2. void U8GLIB::setRot180()
  3. void U8GLIB::setRot270()
复制代码
   2)功能
         将显示的结果旋转90°或180°或270°
    3)参数
    4)例子
  1. //正常
  2. u8g.setFont(u8g_font_osb18);
  3. u8g.drawStr(0,20, "ABC");

  4. //旋转90°
  5. u8g.setRot90(); //or setRot180();  setRot270();
  6. u8g.setFont(u8g_font_osb18);
  7. u8g.drawStr(0,20, "ABC");
  8. //          0°  ↓                           90°  ↓
复制代码

rot0

rot0

rot90

rot90


  >  setFontPosTop
    1)方法定义
  1. void U8GLIB::setFontPosTop(void)
复制代码
   2)功能
         使用drawStr显示字符串时,默认标准为显示字符的左下角坐标。(参考四楼 显示字符 drawStr函数)
         本函数的功能可理解为将坐标位置改为显示字符串的左上角为坐标标准。具体用法可参考例子。
    3)例子
  1. U8GLIB u8g(...)
  2. ...
  3. u8g.setFont(u8g_font_osb18);
  4. u8g.setFontPosTop();
  5. u8g.drawStr(0, 20, "ABC");
复制代码

setFontPosTop

setFontPosTop

回复 支持 1 反对 0

使用道具 举报

 楼主| 发表于 2014-8-20 21:51:30 | 显示全部楼层
本帖最后由 韋編弎絕 于 2014-8-20 21:49 编辑

三楼  几何图形

    本楼介绍常见几何图形的显示。点、线、面

  >  drawPixel
    1)方法定义
  1. void U8GLIB::drawPixel(uint8_t x, uint8_t y)
复制代码
   2)功能
         画一个点
    3)参数
         x:点的横坐标
         y:点的纵坐标
    4)例子
  1. U8GLIB u8g( ... )
  2. ...
  3. u8g.drawPixel(14, 23);
复制代码

drawPixel

drawPixel


  >  drawLine
    1)方法定义
  1. void U8GLIB::drawLine(u8g_uint_t x1, u8g_uint_t y1, u8g_uint_t x2, u8g_uint_t y2
复制代码
   2)功能
         画一条线段
    3)参数
         x1: 线段起点 横坐标
         y1: 线段起点 纵坐标
         x2: 线段终点 横坐标
         y2: 线段终点 纵坐标
    4)例子
  1. u8g.drawLine(7, 10, 40, 55);
复制代码

drawLine

drawLine


  >  drawHLine
    1)方法定义
  1. void U8GLIB::drawHLine(u8g_uint_t x, u8g_uint_t y, u8g_uint_t w)
复制代码
   2)功能
         画一条向右的水平线段
    3)参数
         x:线段起点 横坐标
         y:线段起点 纵坐标
         w:水平宽度(w个像素点)
    4)例子 见下边的drawVLine。

  >  drawVLine
    1)方法定义
  1. void U8GLIB::drawVLine(u8g_uint_t x, u8g_uint_t y, u8g_uint_t h)
复制代码
   2)功能
         画一条向下的垂直线段
    3)参数
         x:线段起点 横坐标
         y:线段起点 纵坐标
         h:垂直高度(h个像素点)
    4)例子
  1. u8g.drawHLine(60,12, 30);
  2. u8g.drawVLine(10,20, 20);
复制代码

drawVLine or HLine

drawVLine or HLine


  >  drawTriangle
    1)方法定义
  1. void U8GLIB::drawTriangle(uint16_t x0, uint16_t y0, uint16_t x1, uint16_t y1, uint16_t x2, uint16_t y2)
复制代码
   2)功能
         画一个实心的三角形。至于空心三角形用drawLine即可画出。
    3)参数
         x0:其中一角的 横坐标
         y0:其中一角的 纵坐标
         x1:另一角的 横坐标
         y1:另一角的 纵坐标
         x2:最后一角的 横坐标
         y2:最后一角的 纵坐标
    4)例子
  1. u8g.drawTriangle(14,9, 45,32, 9,42);
  2. u8g.drawTriangle(14,55, 45,33, 9,43);
复制代码

drawTriangle

drawTriangle


  >  drawFrame
    1)方法定义
  1. void U8GLIB::drawFrame(u8g_uint_t x, u8g_uint_t y, u8g_uint_t w, u8g_uint_t h)
复制代码
   2)功能
         画一个空心矩形
    3)参数
         x:方框左上角点的横坐标
         y:方框左上角点的纵坐标
         w:方框的宽
         h:方框的高
    4)例子
  1. u8g.drawFrame(10, 12, 30, 20); // 方框的长宽包括了边框所在的像素点
复制代码

drawFrame

drawFrame


  >  drawRFrame
    1)方法定义
  1. void U8GLIB::drawRFrame(u8g_uint_t x, u8g_uint_t y, u8g_uint_t w, u8g_uint_t h, u8g_uint_t r)
复制代码
   2)功能
         ]画一个[color=Red圆角空心矩形

         其中 最好满足:w>=2x(r+1), h>=2x(r+1)。
    3)参数
         x:圆角矩形左上角 横坐标
         y:圆角矩形左上角 纵坐标
         w:圆角矩形 宽度
         h:圆角矩形 高度
         r:圆角弧度的半径
    4)例子
  1. u8g.drawRFrame(10,12, 30,20, 5);
复制代码

drawRFrame

drawRFrame


  >  drawBox
    1)方法定义
  1. void U8GLIB::drawBox(u8g_uint_t x, u8g_uint_t y, u8g_uint_t w, u8g_uint_t h)
复制代码
   2)功能
         画一个实心矩形
    3)参数
         x:矩形左上角的 横坐标
         y:矩形左上角的 纵坐标
         w:矩形的 宽
         h:矩形的 高
    4)例子
  1. U8GLIB u8g(...)
  2. ...
  3. u8g.drawBox(10,12,20,30);
复制代码

drawBox

drawBox


  >  drawRBox
    1)方法定义
  1. void U8GLIB::drawRBox(u8g_uint_t x, u8g_uint_t y, u8g_uint_t w, u8g_uint_t h, u8g_uint_t r)
复制代码
   2)功能
         画一个圆角实心矩形,与drawTFrame类似。
    3)参数
         x:圆角矩形左上角 横坐标
         y:圆角矩形左上角 纵坐标
         w:矩形的 宽
         h:矩形的 高
         r:圆角弧度半径

  >  drawCircle
    1)方法定义
  1. void U8GLIB::drawCircle(u8g_uint_t x0, u8g_uint_t y0, u8g_uint_t rad, uint8_t opt = U8G_DRAW_ALL)
复制代码
   2)功能
         画一个空心圆
    3)参数
         x0:圆心 横坐标
         y0:圆心 纵坐标
         rad:半径
         opt:
                 U8G_DRAW_UPPER_RIGHT        上部右侧 1/4 圆弧
                 U8G_DRAW_UPPER_LEFT          上部左侧 1/4 圆弧
                 U8G_DRAW_LOWER_LEFT         下部左侧 1/4 圆弧
                 U8G_DRAW_LOWER_RIGHT       下部右侧 1/4 圆弧
                 U8G_DRAW_ALL                          整圆(默认)
    4)例子
  1. u8g.drawCircle(20,20, 14); //整圆
  2. u8g.drawCircle(20,20, 14, U8G_DRAW_UPPER_RIGHT); //1/4圆
复制代码

drawCricle

drawCricle
         

drawCircle

drawCircle


  >  drawDisc
    1)方法定义
  1. void U8GLIB::drawDisc(u8g_uint_t x0, u8g_uint_t y0, u8g_uint_t rad, uint8_t opt = U8G_DRAW_ALL)
复制代码
   2)功能
         画一个实心圆,直径=2*rad+1
    3)参数
         x0:圆心 横坐标
         y0:圆心 纵坐标
         rad:半径
         opt:
                 U8G_DRAW_UPPER_RIGHT        上部右侧 1/4 扇形
                 U8G_DRAW_UPPER_LEFT          上部左侧 1/4 扇形
                 U8G_DRAW_LOWER_LEFT         下部左侧 1/4 扇形
                 U8G_DRAW_LOWER_RIGHT       下部右侧 1/4 扇形
                 U8G_DRAW_ALL                          整圆(默认)

  >  drawEllipse
    1)方法定义
  1. void drawEllipse(u8g_uint_t x0, u8g_uint_t y0, u8g_uint_t rx, u8g_uint_t ry, uint8_t opt)
复制代码
   2)功能
         圆一个椭圆(空心)
    3)参数
         x0,y0:椭圆圆心 横、纵坐标
         rx:水平方向半径
         ry:垂直方向半径
         opt:
                 U8G_DRAW_UPPER_RIGHT        上部右侧 1/4 椭圆弧
                 U8G_DRAW_UPPER_LEFT          上部左侧 1/4 椭圆弧
                 U8G_DRAW_LOWER_LEFT         下部左侧 1/4 椭圆弧
                 U8G_DRAW_LOWER_RIGHT       下部右侧 1/4 椭圆弧
                 U8G_DRAW_ALL                          整圆(默认)
    4)例子
  1. //相同圆心的椭圆与圆
  2. u8g.drawEllipse(20,20, 14,17);
  3. u8g.drawCircle(20,20, 14);
复制代码

drawEllipse

drawEllipse
(左图只为示意,椭圆实际显示效果要好)

  >  drawFilledEllipse
    1)方法定义
  1. void drawFilledEllipse(u8g_uint_t x0, u8g_uint_t y0, u8g_uint_t rx, u8g_uint_t ry, uint8_t opt)
复制代码
   2)功能
         画一个椭圆(实心)
    3)参数
         x0,y0:椭圆圆心 横、纵坐标
         rx:水平方向半径
         ry:垂直方向半径
         opt:
                 U8G_DRAW_UPPER_RIGHT        上部右侧 1/4 椭圆
                 U8G_DRAW_UPPER_LEFT          上部左侧 1/4 椭圆
                 U8G_DRAW_LOWER_LEFT         下部左侧 1/4 椭圆
                 U8G_DRAW_LOWER_RIGHT       下部右侧 1/4 椭圆
                 U8G_DRAW_ALL                          整圆(默认)
回复 支持 1 反对 0

使用道具 举报

 楼主| 发表于 2014-8-20 21:51:29 | 显示全部楼层
本帖最后由 韋編弎絕 于 2014-8-19 10:28 编辑

二楼  杂项

    若要使图像正常显示,u8glib库提供了如下的picture loop。
  1. #include "U8glib.h"

  2. U8GLIB_SSD1306_128X64 u8g( ... );

  3. void setup() { ... }
  4. void loop() {
  5.   u8g.firstPage();
  6.   do {
  7.     //display
  8.   }while(u8g.nextPage());
  9. }
复制代码
   详见https://code.google.com/p/u8glib/wiki/tpictureloop

  >  firstPage
    1)方法定义
  1. void U8GLIB::firstPage(void)
复制代码
   2)功能
          调用此过程,标志着图像循环的开始

  >  nextPage
    1)方法定义
  1. uint8_t U8GLIB::nextPage(void)
复制代码
   2)功能
          调用此过程,标志着图像循环的结束
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-8-20 21:51:31 | 显示全部楼层
本帖最后由 韋編弎絕 于 2014-8-20 14:52 编辑

四楼  显示字符

  >  drawStr
    1)方法定义
  1. u8g_uint_t U8GLIB::drawStr(u8g_uint_t x, u8g_uint_t y, const char *s)
复制代码
   2)功能
         显示字符,使用前要使用setFont函数设置要显示字符的字体(详见七楼 设置)
         另外还有 drawStr90(); drawStr180(); drawStr270(); 使字符顺时针旋转响应的角度。
    3)参数
         x:字符左下角的横坐标
         y:字符左下角的纵坐标
         *s:要显示的字符
    4)例子
  1. U8GLIB u8g(...)
  2. ...
  3. u8g.setFont(u8g_font_osb18);
  4. u8g.drawStr(0, 20, "ABC");
  5. u8g.drawStr90(0,20, "ABC"); //字符旋转90度
复制代码

drawStr/90

drawStr/90


  >  print
    1)方法定义
  1. U8GLIB::print(...)
复制代码
   2)功能
         打印要显示的字符,包括变量值、字符串等。
         使用前需用setPrintPos()函数设置位置(详见七楼 设置)
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-8-20 21:51:32 | 显示全部楼层
本帖最后由 韋編弎絕 于 2014-8-18 09:17 编辑

五楼  图像

  >  drawXBMP
    1)方法定义
  1. void U8GLIB::drawXBMP(u8g_uint_t x, u8g_uint_t y, u8g_uint_t w, u8g_uint_t h, const u8g_pgm_uint8_t *bitmap)
复制代码
   2)功能
         此函数是一个显示一个位图的方法。
    3)参数
         x:位图左上角的横坐标
         y:位图左上角的纵坐标
         w:位图的宽
         h:位图的高
         *bitmap:位图对象
    4)例子
  1. ...
  2. static unsigned char u8g_logo_bits[] U8G_PROGMEM = {
  3.    0xff, 0xff, 0xff, 0xff, 0x3f,   0xff, 0xff, 0xff, 0xff, 0x3f,   0xe0, 0xe0, 0xff, 0xff, 0x3f,
  4.    0xe3, 0xe1, 0xff, 0xff, 0x3f,   0xf3, 0xf1, 0xff, 0xff, 0x3f,   0xf3, 0xf1, 0xfe, 0xbf, 0x37,
  5.    0xf3, 0x11, 0x1c, 0x1f, 0x30,   0xf3, 0x01, 0x08, 0x8c, 0x20,   0xf3, 0x01, 0x00, 0xc0, 0x39,
  6.    0xf3, 0x81, 0xc7, 0xc1, 0x39,   0xf3, 0xc1, 0xc7, 0xc9, 0x38,   0xf3, 0xc1, 0xc3, 0x19, 0x3c,
  7.    0xe3, 0x89, 0x01, 0x98, 0x3f,   0xc7, 0x18, 0x00, 0x08, 0x3e,   0x0f, 0x3c, 0x70, 0x1c, 0x30,
  8.    0x3f, 0xff, 0xfc, 0x87, 0x31,   0xff, 0xff, 0xbf, 0xc7, 0x23,   0x01, 0x00, 0x00, 0xc6, 0x23,
  9.    0x03, 0x00, 0x00, 0x0e, 0x30,   0xff, 0xff, 0x3f, 0x1f, 0x3c,   0xff, 0xff, 0x3f, 0xff, 0x3f,
  10.    0xff, 0xff, 0x3f, 0xff, 0x3f,   0xff, 0xff, 0xff, 0xff, 0x3f,   0xff, 0xff, 0xff, 0xff, 0x3f
  11. };
  12. ...
  13.   u8g.drawXBMP( 0, 0, 38, 24, u8g_logo_bits);
复制代码

drawXBMP

drawXBMP


  >  drawBitmapP
    1)方法定义
  1. void U8GLIB::drawBitmapP(u8g_uint_t x, u8g_uint_t y, u8g_uint_t cnt, u8g_uint_t h, const u8g_pgm_uint8_t *bitmap)
复制代码
   2)功能
         此函数是一个显示一个位图的方法。
    3)参数
         x:位图左上角的横坐标
         y:位图左上角的纵坐标
         cnt:在水平方向上的位图的字节数。该位图的宽度是cnt* 8(1字节=8位)
         h:位图的高
         *bitmap:位图对象
    4)例子
  1. const uint8_t rook_bitmap[] U8G_PROGMEM = {
  2.   0x00,         // 00000000
  3.   0x55,         // 01010101
  4.   0x7f,          // 01111111
  5.   0x3e,         // 00111110
  6.   0x3e,         // 00111110
  7.   0x3e,         // 00111110
  8.   0x3e,         // 00111110
  9.   0x7f           // 01111111
  10. };
  11. ...
  12. u8g.drawBitmapP(0,0, 1, 8, rook_bitmap);
复制代码

drawBitmapP

drawBitmapP


回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-8-20 21:51:33 | 显示全部楼层
本帖最后由 韋編弎絕 于 2014-8-20 16:19 编辑

六楼  获得

  >  getHeight
    1)方法定义
  1. u8g_uint_t U8GLIB::getHeight(void)
复制代码
   2)功能
         获得屏幕的高度,本函数放置在picture loop里面或外部皆可
    3)返回值
         屏幕高度

  >  getWidth
    1)方法定义
  1. u8g_uint_t U8GLIB::getWidth(void)
复制代码
   2)功能
         获得屏幕宽度,本函数放置在picture loop里面或外部皆可
    3)返回值
         屏幕宽度
    4)例子
  1. w = u8g.getWidth();
  2. h = u8g.getHeight();
复制代码

getHeight or Width

getHeight or Width


  >  getStrWidth
    1)方法定义
  1. u8g_uint_t U8GLIB::getStrWidth(const char *s)
复制代码
   2)功能
         获得所显示字符串的宽度,即按照不同字体显示的字符串共占了多少像素。
    3)返回值
         字符串的宽度
    4)例子
  1. ...
  2. int w;  
  3. ...
  4. u8g.setFont(u8g_font_osb18); //设置字体
  5. u8g.drawStr(0,20, "ABC");
  6. w = u8g.getStrWidth("ABC"); //获得显示的字符串宽度
  7. u8g.drawFrame(0,10, w,11); //画一个以获得的字符串宽度为宽度的方框。
复制代码

getStrWidth

getStrWidth

回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-8-20 21:51:35 | 显示全部楼层
本帖最后由 韋編弎絕 于 2016-5-30 22:48 编辑

八楼  附录/补充

    占楼以作备用。

    u8glib库的下载地址:https://bintray.com/olikraus/u8glib


github上的u8glib库 : https://github.com/olikraus/u8glib
回复 支持 反对

使用道具 举报

发表于 2014-8-20 22:38:44 | 显示全部楼层
密切关注,学习下,收藏

点评

我想把测距传感器的数据以坐标的形式表现在建立在OLED的坐标系上 应该如何写程序呢  发表于 2016-12-23 15:06
回复 支持 反对

使用道具 举报

发表于 2014-8-22 00:57:30 来自手机 | 显示全部楼层
好资料!支持楼主!
回复 支持 反对

使用道具 举报

发表于 2014-8-23 10:59:44 来自手机 | 显示全部楼层
很好的资料,楼主辛苦了。
回复 支持 反对

使用道具 举报

发表于 2014-8-23 12:25:49 | 显示全部楼层
韋編弎絕 发表于 2014-8-20 21:51
七楼  设置
  >  setFont
    1)方法定义U8GLIB::setFont(const u8g_fntpgm_uint8_t *font)[/code]    2) ...

收藏,学习,这才是最有利于外语门外汉学习
回复 支持 反对

使用道具 举报

发表于 2014-8-31 08:58:28 | 显示全部楼层
好东西,谢谢了!
回复 支持 反对

使用道具 举报

发表于 2014-8-31 15:31:23 | 显示全部楼层
超棒的教程,太感谢了。
回复 支持 反对

使用道具 举报

发表于 2014-9-13 04:56:32 | 显示全部楼层
楼主辛苦了 终于弄懂这些了
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

Archiver|联系我们|极客工坊 ( 浙ICP备09023225号 )

GMT+8, 2018-12-11 15:44 , Processed in 0.054768 second(s), 29 queries .

Powered by Discuz! X3.4 Licensed

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表