Czy jest temat Bowtie, który wygląda jak ikona Flurry?

2

Mam kilka Płomienne ikony na moim komputerze połączonym z często używanymi aplikacjami. Wyobrażam sobie niemal identyczną wyglądającą ikonę, ale zamiast ikony i nazwy pliku wyświetla ona okładkę albumu i nazwę utworu aktualnie odtwarzanego utworu za pomocą Muszka .

Czy istnieje taki temat? Jeśli nie, to jaki jest najłatwiejszy sposób tworzenia od podstaw?

(Informacje na temat tworzenia tematów dla Bowtie można znaleźć tutaj . To głównie HTML i CSS.)

icon themes Timothy Mueller-Harder
źródło
2
Czym są Flurry i Bowtie?
Daniel
@bmike Bowtie to aplikacja, która działa na pulpicie, aby wyświetlać jakieś informacje o bieżącym utworze w iTunes lub Spotify. Flurry to zestaw ikon w stylu iOS dla wielu popularnych aplikacji OS X, stworzony przez Iconfactory.
Timothy Mueller-Harder
@senseful ma pomocne linki, które pominąłem. Dzięki. :)
Timothy Mueller-Harder

Odpowiedzi:

3

Możesz zacząć od dostosowania domyślnego motywu dołączonego do Bowtie, a także HTML / CSS. Skopiuj go z pakietu aplikacji ( Bowtie.app/Contents/Themes/Default.bowtie ) do ~/Library/Application Support/Bowtie i zmień nazwę na np. Flurry.bowtie.

Pamiętaj, aby edytować wszystkie informacje zawarte w zawartym pliku .plist plik, zwłaszcza nazwa ( BTThemeName ) i identyfikator ( BTThemeIdentifier ) do niestandardowych, unikalnych wartości.

Aby przejść od tego tematu do czegoś bardziej podobnego do Flurry, należy zmienić następujące elementy:

  • -webkit-border-radius w #artHolder (Użyłem 18px )
  • -webkit-box-shadow, ta sama lokalizacja (np. 0px 0px 4px #000 )
  • width i height, ta sama lokalizacja (użyłem 96px ).
  • Usunąć img odwoływanie się do tagów img/gloss.png.

Wynik będzie wyglądał następująco:

Screenshot of intermediate Flurry style

Brakuje odpowiedniej granicy i może błyszczącej nakładki. Plik img/gloss.png w temacie tworzy efekt nakładki błyszczącej w kompozycji domyślnej. Zamień plik obrazu na własny zawierający obramowanie, a niektóre zaznacz na górze pasujące do stylu Flurry. Bezczelnie rozerwałem ikonę AirPort Flurry, usunąłem zawartość tła i obramowania i użyłem wyniku jako obrazu nakładki. Nie rób tego, chyba że wiesz tak mało o edycji obrazu, jak ja.

Pozycja obramowania zostanie wyłączona o kilka pikseli. Pobaw się z top i left wartości w CSS obrazu do momentu dopasowania do okładki. Zmień rozmiar okładki lub rozmiar obrazu obramowania, aż będą pasować do potrzeb.

Tak wygląda teraz na ciemniejszym tle:

Screenshot of final Flurry style

Teraz brakuje świateł na górze i efektu błyszczącego, ale to wszystko, co mogę zrobić w edytorze obrazów.

Oczywiście jest to tylko zarys ogólny. Wiele zależy od szczegółowych wymagań, które musisz rozwiązać samodzielnie, np. czy chcesz także odwrócić obraz okładki, aby uzyskać elementy sterujące i jak powinny wyglądać

Nie jestem pewien co do licencji tutaj. Aby być bezpiecznym, zwłaszcza jeśli chcesz opublikować swój motyw, nadaj mu oryginalny wygląd, zwłaszcza obraz obramowania / nakładki.

Daniel Beck
źródło
Świetna odpowiedź! Chociaż jest to bardzo pomocne, nie oznaczam tego jako odpowiedź, ponieważ rezerwuję to, jeśli ktoś (łącznie ze mną) skończy tworzyć cały temat i go opublikować. Jeszcze raz dziękuję za odpowiedź. :)
Timothy Mueller-Harder
@ Dzięki TimothyMueller-Harder. Chociaż chciałbym to zrobić, w zasadzie kradnę tutaj kompozycję Iconfactory, więc proszę, zrozum, że po prostu nie mogę opublikować tego w obecnej formie. Po prostu nie mam umiejętności edycji obrazu, aby zrobić to od zera.
Daniel Beck
Dobrze. Nie sugerowałem niczego, tylko tłumaczyłem, dlaczego nie oznaczam go jako „technicznie” odpowiedział. :)
Timothy Mueller-Harder