You can download and install the Material Icon web font (https://google.github.io/material-design-icons/#icon-font-for-the-web) and then add a font mapping to your publish configuration (https://fonts.googleapis.com/icon?family=Material+Icons). After that you can just type in the name of the icon and set the font to “Material Icons”. This method is particularly handy for using icons in repeaters because you can use the “set to rich text” option to change images and colors without resorting to dynamic panels for each, different image.
As far as combining icons and text, I haven’t really found any better solution than you have. The most consistent method I’ve been able to come up with is to treat the button widget as two pieces. Basically, I make two “buttons”, one with the icon in it and one with the text, and then group them together. Looks something like this:
Using the widget’s padding style makes adjusting things a lot easier.