In this section, we will display the results of a search performed on the TED video site in a side bar that we can scroll up and down, as shown in the following screenshot:
Let's start defining the components of the side bar in the sidebar.kv file:
432. # File name: sidebar.kv 433. <ListItem>: 434. size_hint: [1,None] 435. height: 70 436. group: 'listitem' 437. text_size: [self.width-20, None] 438. 439. 440. <Sidebar@ScrollView>: 441. playlist: _playlist 442. size_hint: [None, None] 443. canvas.before: 444. Color: 445. rgba: 0,0,0,.9 446. Rectangle: 447. pos: 0,0, 448. size: self.width,self.height 449. 450. GridLayout: 451. id: _playlist 452. size_hint_y: None 453. cols: 1
The ListItem class inherits from ToggleButton. The text_size property will establish a boundary for the text. If the titles of the videos are too long, two lines...