[RVB2601 Creative Application Development] Practice 6-Multi-level menu display test

DDZZ669

[RVB2601 Creative Application Development] Practice 6-Multi-level menu display test [Copy link]

 

Multi-level menu

The implementation of multi-level menus can be roughly divided into two design ideas:

• Implemented via a doubly linked list
• Implementation through array lookup

The general idea is to connect the various interfaces of the menu, so that you can jump from the upper menu to the lower menu, and return to the upper menu from the lower menu.

The array lookup method is relatively simple and easy to understand. This article will use the array lookup method to display a multi-level menu on RVB2601.

Code Modification

Array Lookup

First you need to define a structure:

typedef struct
{
    uchar current;
    uchar down;//向下翻索引号
    uchar enter;//确认索引号
    void (*current_operation)();
} key_table;

• current: the index number of the current page
• down: The index number of the page to jump to after pressing the "down" button
• enter: The index number of the page to jump to after pressing the "Confirm" button
• current_operation: The display function to be executed for the index number of the current page

Note: Since there are only two user buttons on the RVB2601 board, only the "Scroll Down" and "Confirm" buttons are defined here. If you need more buttons, you can also define a "Scroll Up" button to switch the options in the menu up and down.

Then define a table to define how to jump between pages

key_table table[30]=
{
  //第1层
    {0,1, 4,(*fun_a1)},
    {1,2, 8,(*fun_b1)},
    {2,3,12,(*fun_c1)},     
    {3,0,25,(*fun_d1)},
    
  //第2层
    {4,5,16,(*fun_a21)},                    
    {5,6,17,(*fun_a22)},
    {6,7,18,(*fun_a23)},                                     
    {7,4, 0,(*fun_a24)},
    
    { 8, 9,19,(*fun_b21)},                  
    { 9,10,20,(*fun_b22)},
    {10,11,21,(*fun_b23)},                                   
    {11, 8, 1,(*fun_b24)},
    
    {12,13,22,(*fun_c21)},                  
    {13,14,23,(*fun_c22)},                           
    {14,15,24,(*fun_c23)},                           
    {15,12, 2,(*fun_c24)},
    
  //第3层
    {16,16,4,(*fun_a31)},                        
    {17,17,5,(*fun_a32)},                    
    {18,18,6,(*fun_a33)},
    
    {19,19, 8,(*fun_b31)},                           
    {20,20, 9,(*fun_b32)},                       
    {21,21,10,(*fun_b33)},
    
    {22,22,12,(*fun_c31)},                       
    {23,23,13,(*fun_c32)},                       
    {24,24,14,(*fun_c33)},  
    
  //第0层
    {25,25,0,(*fun_0)},                         
};

Specific display function

/*********第1层***********/
void fun_a1()  
{   
    u8g2_DrawStr(&u8g2,0,16,">");
    u8g2_DrawStr(&u8g2,16,16,"[1]Weather");
    u8g2_DrawStr(&u8g2,16,32,"[2]Music");
    u8g2_DrawStr(&u8g2,16,48,"[3]Device Info");
    u8g2_DrawStr(&u8g2,16,64,"<--");                                                                                    
}

void fun_b1()  
{   
    u8g2_DrawStr(&u8g2,0,32,">");
    u8g2_DrawStr(&u8g2,16,16,"[1]Weather");
    u8g2_DrawStr(&u8g2,16,32,"[2]Music");
    u8g2_DrawStr(&u8g2,16,48,"[3]Device Info");
    u8g2_DrawStr(&u8g2,16,64,"<--");                                                                                        
}

void fun_c1()   
{   
    u8g2_DrawStr(&u8g2,0,48,">");
    u8g2_DrawStr(&u8g2,16,16,"[1]Weather");
    u8g2_DrawStr(&u8g2,16,32,"[2]Music");
    u8g2_DrawStr(&u8g2,16,48,"[3]Device Info");
    u8g2_DrawStr(&u8g2,16,64,"<--");                                                                                    
}

void fun_d1()   
{   
    u8g2_DrawStr(&u8g2,0,64,">");
    u8g2_DrawStr(&u8g2,16,16,"[1]Weather");
    u8g2_DrawStr(&u8g2,16,32,"[2]Music");
    u8g2_DrawStr(&u8g2,16,48,"[3]Device Info");
    u8g2_DrawStr(&u8g2,16,64,"<--");                                                                                            
}

/*********第2层***********/
void fun_a21()   
{   
    u8g2_DrawStr(&u8g2,0,16,">");
    u8g2_DrawStr(&u8g2,16,16,"* HangZhou");
    u8g2_DrawStr(&u8g2,16,32,"* BeiJing");
    u8g2_DrawStr(&u8g2,16,48,"* ShangHai");
    u8g2_DrawStr(&u8g2,16,64,"<--");                                                                                        
}
//省略...

Button to switch pages

void key_loop(void)
{
    if(GPIO_PIN_LOW == csi_gpio_pin_read(&key1)) 
    {
        //持续按键置标志
        if(g_key1) 
        {
            g_key1 |= 0x40;
        }
        else 
        {
            g_key1 = 1;
        }
    }
    //持续按键后释放
    else if(g_key1 & 0x40)
    {
        LOGD(TAG, "\n===key1=%d, %s, %d\n", g_key2, __FUNCTION__, __LINE__);
        g_key1=0x80;
        func_index = table[func_index].enter;  //确认
    }
    else 
    {
        g_key1 = 0;
    }
    
    if(GPIO_PIN_LOW == csi_gpio_pin_read(&key2)) 
    {
        if(g_key2)
        {
            g_key2 |= 0x40;
        }
        else 
        {
            g_key2 = 1;
        }
    }
    else if(g_key2 & 0x40)  
    {
        LOGD(TAG, "\n===key2=%d, %s, %d\n", g_key2, __FUNCTION__, __LINE__);
        g_key2=0x80;
        func_index = table[func_index].down;  //向下翻
    }
    else 
    {
        g_key2 = 0;
    }
    
    if (func_index != last_index)
    {
        current_operation_index = table[func_index].current_operation;

        u8g2_ClearBuffer(&u8g2); 
        (*current_operation_index)();//执行当前操作函数
        u8g2_SendBuffer(&u8g2);

        last_index = func_index;
    }
}

Demo

The test results are as follows:

Summarize

This article introduces how to display a multi-level menu on the screen of RVB2601.

Jacktang

The key switching effect is OK

lugl4313820

That’s awesome, my brother!