SES-116 Update icons rmd and package json
This commit is contained in:
parent
f75e20876b
commit
a7aaacb2e5
@ -6,23 +6,10 @@
|
||||
"start": "ng serve",
|
||||
"build": "ng build",
|
||||
"build:ssr": "ng run SessionCompanion:server:dev",
|
||||
"generate-icons": "svg-to-ts",
|
||||
"test": "ng test",
|
||||
"lint": "ng lint",
|
||||
"e2e": "ng e2e"
|
||||
},
|
||||
"svg-to-ts": {
|
||||
"conversionType": "constants",
|
||||
"srcFiles": [
|
||||
"./src/app/shared/sc-icons/icons/**/*.svg"
|
||||
],
|
||||
"outputDirectory": "./src/app/shared/sc-icons/icons",
|
||||
"interfaceName": "SessionCompanionIcon",
|
||||
"typeName": "scIcon",
|
||||
"prefix": "scIcon",
|
||||
"fileName": "sc-icon.model",
|
||||
"compileSources": true
|
||||
},
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@angular/animations": "8.2.12",
|
||||
@ -66,7 +53,6 @@
|
||||
"karma-coverage-istanbul-reporter": "~2.1.0",
|
||||
"karma-jasmine": "~2.0.1",
|
||||
"karma-jasmine-html-reporter": "^1.4.2",
|
||||
"svg-to-ts": "^6.0.0",
|
||||
"typescript": "3.5.3"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
|
@ -1,29 +1,4 @@
|
||||
Moduł został już dodany i wstrzyknięty do roota apki.
|
||||
|
||||
Aby dodać nową ikonkę, plik svg wstawiamy do folderu icons/svg-icons.
|
||||
Następnie wpisujemy w konsoli polecenie:
|
||||
npm run generate-icons
|
||||
|
||||
Zostaną wtedy utworzone nowe klasy z dodaną ikonką.
|
||||
|
||||
Jeśli po tym będziemy chcieli użyć gdzieś naszej ikonki, nie pojawi się ona...
|
||||
Jest to spowodowane tym, że nie chcemy, aby aplikacja wczytywała w jednym momencie wszystkie nasze ikonki a jedynie te potrzebne
|
||||
Musi więc ją dodać w odpowiednim momencie do rejestru, w innym wypadku w konsoli dostaniemy komunikat:
|
||||
![img.png](warning.png)
|
||||
|
||||
Teraz zarejestrujmy naszą ikonkę:
|
||||
|
||||
Dodajemy w konstruktorze danego komponentu:
|
||||
```typescript
|
||||
iconRegister: SessionCompanionIconsRegistry
|
||||
```
|
||||
|
||||
Następnie dodajemy interesującą nas ikonkę:
|
||||
```typescript
|
||||
this.iconRegister.registerIcon(scIconBarbarian);
|
||||
```
|
||||
|
||||
Samą ikonkę ładujemy w tagu
|
||||
```html
|
||||
<app-sc-icons name="barbarian"></app-sc-icons>
|
||||
```
|
||||
Aby dodać nową ikonkę, plik svg wstawiamy do folderu assets/icons/svg-icons.
|
||||
Oraz dodajym kolejnego enuma w pliku sc-icon.model.ts
|
||||
|
Binary file not shown.
Before Width: | Height: | Size: 3.3 KiB |
Loading…
Reference in New Issue
Block a user